조금 늦었지만 파이널 프로젝트 회고를 작성해보려한다.더샤아니의 고투게더 반응형 웹페이지 리뉴얼, 시니어를 대상으로 한 여행 패키지 상품 검색 및 추천 서비스로 FrontEnd, BackEnd, UX/UI 협업 프로젝트이다. 주된 기능으로는 로그인, 회원가입, 상품검색,

조금 늦었지만 미니프로젝트 회고를 작성해보려한다. 1. 프로젝트 설명 금융상품 중 카드를 상품으로 다루고, 추천해주는 서비스로 FrontEnd와 BackEnd 협업 프로젝트이다. 주된 기능으로는 로그인, 회원가입, 나의 카드(신청한 카드), 검색, 카드 추천, 관

어제부터 본격적으로 미니프로젝트를 시작했다.많은 어려움이 예상된다.일단 초기설정과 대략적인 UI는 만들었다.기간이 2 ~ 3주 정도 되는데 좋은 결과물이 나왔으면 좋겠다.

이번 포스트는 React의 Context API에 대해서 작성해보려고 한다. Context-API는 컴포넌트 트리에서 속성을 전달하지 않고 필요한 데이터를 컴포넌트에 전달하는 방법을 제공하는 API다.기존에는 부모 컴포넌트에서 상태와 상태를 변경하는 함수를 만들고 속성

이번 포스트는 React의 Hook 중 하나인 useRef에 대해서 작성해보려고 한다.useRef는 변수 관리 또는 DOM요소에 접근하기 위해 사용되는 React Hook이다. 여기서 Ref는 reference, 즉 참조를 뜻한다.바닐라 자바스크립트를 사용 할 때, 우

이번 주 월요일부터 오늘까지 팀원 4명과 함께 유튜브 api를 사용하여 유튜브 클론 코딩 토이 프로젝트를 진행했다. 팀원분들이 다 너무 잘하고 착하셔서 분위기가 정말 좋았다. 특히 가장 고생하시는 우리 석지 팀장님ㅠㅠ. 여러가지 어려운 점이 있었다.일단 가장 짜증 났던

이번 포스트는 React의 Hook 중 하나인 useEffect에 대해서 작성해보려고 한다.useEffect는 React의 Hook 중 하나로 컴포넌트가 렌더링 될 때 특정 작업을 실행할 수 있도록 하는 Hook이다.컴포넌트가 처음 렌더링 될 때 한 번, 특정 값이 변

이번 포스트는 React의 Hook 중 하나인 useState에 대해서 작성해보려고 한다.state는 컴포넌트 내에서 지속적으로 변경이 일어나는 값을 관리하기 위해 사용한다.개발자가 의도한 동작에 의해 변할 수도 있고 사용자의 입력에 따라 새로운 값으로 변경될 수도 있

이번 포스트는 저번 포스트에 이어서 React 컴포넌트의 props에 대해서 작성해보려고 한다.props 는 properties 의 줄임말이다. 우리가 어떠한 값을 컴포넌트에게 전달해줘야 할 때, props 를 사용한다.지난 포스트에서 상자를 만들었을 때 상자안의 내용

이번 포스트는 React의 컴포넌트에 대해서 작성해보려고 한다. 리액트로 만들어진 앱을 이루는 최소한의 단위이다.컴포넌트는 재사용을 할 수있다.컴포넌트는 데이터(props)를 입력받아 View(state) 상태에 따라 DOM Node를 출력하는 함수이다.컴포넌트 이름은

프론트엔드의 프레임워크 및 라이브러리로는 대표적으로 Angular, React, 그리고 Vue가 있다. 이들의 차이점은 각각 무엇이며 그 차이점은 무엇일지에 대해 알아보자.참고로 Vue와 Angular는 프레임워크인 반면 React는 라이브러리이다.Angular는 구글

이번 포스트는 React를 시작하는 법에 대해서 작성해보려고 한다. 먼저 Node.js를 설치해야 한다. 다운로드VSCode를 열고 터미널에 npx create-react-app "파일 이름" 입력!!설치가 완료되면 해당 파일로 들어간 후 터미널에 npm start 입

이번 포스트는 SPA와 MPA에 대해서 작성해보려고 한다. 각각 무엇인지 그리고 어떤 장단점이 있는지 한번 알아보자MPA(Multi Page Application)는 여러 개의 페이지로 구성된 애플리케이션을 의미한다. MPA는 새로운 페이지를 요청할 때마다 정적 리소스

자바스크립트에는 호이스팅이라는 신기한 현상이 존재한다. 이번 포스트에서는 이 호이스팅에 대해 알아보자.호이스팅이란 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미한다. var로 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기하는 반면 l

자바스크립트의 객체(Object) 자료형은 개발을 하면서 많이 쓰인다. 값을 키와 값으로 묶어 저장하고 조회하는 기능이 유용하고 필요하기 때문이다. 이번 포스트에서는 자바스크립트 객체를 좀 더 발전시킨 ES6 문법인 Map Object (맵 객체)에 대해 알아보자.

자바스크립트에는 배열의 요소들을 정렬시켜주는 내장함수인 sort()가 존재한다.이번 포스트에서는 sort() 함수의 사용법에 대해 알아보자.compareFunction 은 정렬 순서를 정의하는 함수이다. 이 것을 생략하면, 배열의 요소들은 문자열로 취급되어, 유니코드

자바스크립트에는 문자열을 다룰 수 있게 만들어 주는 내장함수들이 존재한다.이번 포스트에서는 문자열의 내장함수들 중 많이 쓰이는 것들을 알아보자.indexOf 는 인수로 전달받은 문자열을 검색하여 첫 번째 인덱스를 반환한다. 찾지 못하면 -1를 반환한다.includes

자바스크립트에는 배열을 좀 더 쉽게 다룰 수 있게 만들어 주는 내장함수들이 존재한다.이번 포스트에서는 배열의 내장함수들 중 많이 쓰이는 것들을 알아보자.배열 안에 있는 모든 원소들을 출력해야 할 때 보통 for 문을 사용하여 다음과 같이 구현 할 수 있다. 하지만 fo

Commit Message Convention은 커밋 메시지의 규칙을 정해두는 것이다. 팀 단위로 협업을 할 때 유용하게 사용되며 커밋 히스토리를 읽는것 만으로도 변경사항을 이해할 수 있도록 commit message를 남기는 것이다.그 중에서 가장 많이 쓰이는 Ang

저번 포스트에서는 기본적인 git과 github 사용법 대해서 알아보았다. 이번 포스트에서는 저번 포스트에 이어서 branch에 대해서 알아보자. A, B, C 3명의 개발자가 있고 이들은 같은 소스코드를 공유한다고 헤보자. 그리고 각각 a, b, c라는 다른 작업을