화성갈끄니까아

프로젝트 기간 🗓 : 2022.05.23(월) ~ 2022.06.03(금) 클론 사이트 📎 : 반려소반 - https://petsoban.com 팀명 📌 : CatCoDog GitHub 📌 : https://github.com/wkddb1359/33-1st-CatCoDog-frontend 팀 구성 및 기술 스택 ⚙️ FrontEnd - HTML/CSS, JavaScript, React, React-Router, Sass, Git 김철회 남하임 윤경연 안성주 정재성 BackEnd - Python, Django, MySQL, Git 강세영 박준형 새로운 설렘을 기다리며 ☀️ 나는 항공소프트웨어공학과 전공자로써 3번의 프로젝트와 스타트업에서 실습 프로젝트 경험을 한 적이 있었다. 하지만 매번 대학교에서의 프로..

RESTful API란? 사전적인 의미로는 REST라는 아키텍처를 그대로 적용해서 구현한 웹 서비스를 나타내기 위해 사용되는 용어이다. 쉽게 생각해서 REST API를 제공하는 웹 서비스를 RESTful 하다고 생각하면 된다. RESTful은 누가 공식적으로 발표한 것이 아니라 REST 구조가 있는 시스템을 RESTful 이라고 한다. RESTful API의 목표 이해하기 쉽고 사용하기 용이한 REST API를 만드는 것 요청을 보내는 주소만으로도 대략적으로 어떠한 것을 요청하는지 알 수 있어야 한다. RESTful API를 구현하는 근본적인 목표는 성능 향상이 아니라 API에 대한 가독성, 이해도를 높여주는 것이기 때문에 성능이 중요시 되는 서비스 경우에는 굳이 RESTful API를 구현할 필요는 없..

API (Application Programming InterFace) 란? 사전적인 의미로는 응용프로그램에서 사용할 수 있도록, 운영 체제나 프로그래밍 언어가 제공하는 기능을 제어할 수 있는 인터페이스를 의미한다. 사전적인 의미로 이해하기란 어렵기 때문에 비유를 통하여 정리하였다. 컴퓨터에 텍스트를 작성하거나 코드를 작성하기 위해서는 반드시 키보드가 필요합니다. 사용자가 키보드를 누르면 컴퓨터에 전달하고 그 후의 동작은 컴퓨터가 알아서 처리하게 됩니다. 여기서 키보드가 API라고 생각하면 된다. API는 다시 말해서 한 소프트웨어가 다른 소프트웨어로 지정된 형식으로 요청 및 명령을 받을 수 있는 수단이다. 즉 소프트웨어들이 서로 상호작용하는 것을 도와주는 매개체라고 볼 수 있다. 왜 API를 사용하는가..

Side Effect useEffect를 알아보기 전에 부작용(Side Effect) 먼저 알아보자. 부작용은 일반적으로 부정적인 의미로 사용된다. 하지만 프로그래밍 측면에서는 부수적인 작용이라는 의미로 사용되기 때문에 오해하지 않도록 한다. let count = 0; function greetWithSideEffect(name) { count = count + 1 // Side Effect return `${name}님 안녕하세요!` // output } 다음과 같은 코드는 부작용(Side Effect)이 존재한다라고 말할 수 있다. 외부에 있는 코드를 접근하거나 수정, 읽는 경우 부작용(Side Effect)이 있는 코드가 되는 것이다. sideEffect는 랜더링을 막기(block)때문에 랜더링을 ..

Styled-components css 파일 없이 style을 적용시키는 방법이다. How to use styled-components 우선 import가 필요하다. import styled from 'styled-components' 다음의 구조와 같이 styled-components를 선언한다. styled 컴포넌트는 해당 컴포넌트에만 적용이 가능한 특징을 가지고 있다. 따라서 해당 컴포넌트의 모든 div태그는 배경색은 빨간색, 패딩값은 20px, 글자색은 하얀색으로 적용이 된다. styled 속성을 작성을 완료하였으면 변수에 담아 이러한 구조로 사용한다. styled-components는 컴포넌트이기 때문에 반드시 앞에 대문자를 사용해야한다. *대문자를 사용하지 않으면 인식이 안되는 경험을 했다ㅠㅠ..

map 함수를 왜 사용할까? 반복되는 데이터에 대해서 for문을 사용해도 되는데 사용하지 못하는건가? 리엑트의 jsx에서는 if문과 같이 for문도 사용할 수 없다. 따라서 리엑트에서 반복문을 사용하려면 map함수를 쓸 수 밖에 없다...! * if문도 불가능하기 때문에 삼항연산자를 사용해요! map 함수의 기본 구조 배열.map(callback함수, index) callback함수는 새로운 배열의 요소를 생성하고 index는 현재 처리하고 있는 요소의 값을 뜻한다. 배열.map(function(a, index)) a의 역할은 배열의 원소 하나 하나씩 접근한다. index는 반복문이 실행될 때 마다 0부터 1씩 증가하는 정수이다. const str = ['a','b','c','d','e'] const m..