오늘로 입사 한달 차가 되었다! 그동안 소소하게 디버깅도 하고 새롭게 추가되는 기능을 맡아 페이지를 제작하기도 했다.특히 이번에 맡아서 제작한 기능(페이지)는 비대면 계약서 작성으로 유저가 카카오 알림톡에 있는 링크를 타고 들어와 계약서 작성을 위한 정보를 기입하고

폴더구조 store > actions > index.js store > reducers > cartReducer.js ![](https://images.velog.io/images/eunsonny/post/20ba74db

NextJs 설치 & 초기세팅 1. create-next-app npx 또는 yarn을 사용하여 next 프로젝트를 생성할 수 있다. create-next-app은 create-react-app과 같이 next 환경을 손쉽게 세팅할 수 있는 명령어이다. 2.

Wecode, 기업협업 위코드의 마지막 4주에는 기업협업을 나가거나 개인 프로젝트를 하는 것 둘 중 선택할 수 있다. 나는 기업협업을 나가는 것을 선택했고 'Rencar' 라는 모빌리티 서비스를 제공하고 있는 IT 스타트업에 가게 되었다.

이번 글에서는 SSR (Server Side Rendering)과 CSR (Client Side Rendering)에 대해서 알아 볼 것이다.

TDD란 Test Driven Development의 약자로 '테스트 주도 개발'이라고 한다.

재사용성! 개발자라면 누구나 이 단어를 무수히 많이 들었을 것이다. 효율성을 중시하는 개발의 특성상 재사용성은 여러번 강조 되어도 모자를지도 모른다. 나 역시도 처음 코딩을 접했던 유투브 영상에서부터 재사용성에 대한 이야기를 들었고 항상 이 부분을 염두에 두고 코드

Optional chaining이란? > Optianal chaining 연산자 는 각 체인의 참조가 유효한지 명시적으로 검증하지 않고, 연결된 체인 내에 깊숙이 위치한 속성 값을 읽을 수 있다. 연산자는 체이닝 연산자와 유사하게 작동하지만, 만약 참조가 null

명령형 프로그래밍과 선언형 프로그래밍에 대한 비교를 어디선가 한 번쯤은 접해봤을 거라 생각합니다. 그리고 그 둘이 실제로 무엇을 의미하는지 검색을 해보셨다면 아마 아래와 같은 정의를 마주했을 것입니다.명령형 프로그래밍은 무엇을 어떻게 할 것인가에 가깝고, 선언형 프로그

최근에 MobX를 사용하는 프로젝트를 Redux를 사용하도록 변경하게 되었다. 여기에는 몇가지 이유가 있는데, 이것이 MobX의 단점 내지는 MobX를 사용하기 전에 고려해야할 사항들이 될 것 같아서 정리해서 남겨본다.MobX가 배우기도, 다루기도 쉬운데 왜 Redux

이번 글에서는 아마 대부분 들어는 봤고 많은 분들이 실제로 쓰고도 있지만, 제대로 알아볼 시간은 없지 않았을까 싶은 GitFlow 에 대해 다뤄보려고 합니다.GitFlow아래의 글이 GitFlow 의 시작입니다.https://nvie.com/posts/a-su

Hello, MobXMobX은 Redux가 메인이었던 상태관리 생태계에 천천히 경쟁자로 자리 잡았습니다. 이것이 우연일까요? MobX는 정말쉽고, 정말 강력합니다. 그리고 React와 함께 사용 되었을 때 이 강점들은 더욱 강력해집니다. 상태관리 솔루션이 꽤 중요해진

아토믹 디자인이란?아토믹 디자인은 쉽게 말하면 디자인 요소들을 나누어 파악하고 이 요소들이 조합되는 과정을 통해서 디자인을 구성하는 방식을 의미한다. (즉, 컴포넌트 중심의 디자인 패턴인 것)Atoms: 하나의 구성 요소. 본인 자체의 스타일만 가지고 있으며 다른 곳에

NextJS란 무엇이며, 왜 사용하는 것일까?

styled-componentReact CSS-in-Js관련 라이브러리중에서 가장 인기가있다. 자바스크립트 파일 안에서 CSS를 작성하는 형태이다. 그렇기때문에 .css/.scss 파일을 만들지 않아도 된다.시작하기$ yarn add styled-component문법문

Git에서 한 branch에서 다른 branch 합치는 방법 중 하나로, 말 그대로 main을 초기의 main이 아닌 업데이트 된 main으로 rebase하여 commit 내역을 깔끔하게 관리할 수 있는 방법이다. Git에서 한 브랜치에서 다른 브랜치로 합치는 방법은

🙋 숙박 예약 사이트 개발 프로젝트를 진행했습니다. 총 2주의 기간동안 Front-end 4명, Back-end 2명이 협업 했습니다.

과거에 리액트 함수형 컴포넌트(Functional Component)는 클래스 컴포넌트(Class Component)와 달리 state나 life cycle method들을 사용할 수 없어 Stateless Component라고 불렸으며 단순히 props를 받아서 렌더

API key 받기홈페이지에 구글 지도를 넣기 위해서는 가장 먼저 API key를 받아야 한다.Google Maps Platform에 들어간다.시작하기를 누른다.원하는 제품을 선택하고 프로젝트를 선택한다.결제 정보를 입력 하라고 하는데 결제 되는 것이 아니라 로봇인지

목록형 UI에서 데이터를 한 번에 가져오는 것이 아니라 필요한 만큼, 또는 화면에 보이는 만큼만 백엔드에 요청하고 응답받아 사용하는 방식을 말한다.꼭 게시판처럼 1~10 페이지가 있는 형식 뿐 아니라 인스타그램 처럼 가장 하단으로 스크롤이 내려왔을 때 새로운 데이터를