post-thumbnail

[알고리즘|자료구조] Binary / Linear

알고리즘은 왜 배워야하나? 개발자가 어떤 알고리즘을 선택하는지에 따라 해당 작업을 수행하는 스피드가 많이 차이납니다. 그렇기 때문에 어떤 자료구조를 언제 선택하는지 그리고 무슨 알고리즘을 언제 선택해야하는지 알아야합니다. 알맞는 자료구조와 알고리즘을 선택하게 되면 코드

2022년 6월 11일
·
0개의 댓글
post-thumbnail

[JS 코딩 테스트] 준비 - VSCode 환경 세팅

1. 비주얼 스튜디오 터미널을 열어 node를 입력 터미널 여는 단축키 - ctrl + backtic 2. 완료 되면 터미널을 종료한다 종료하는 단축키 - ctrl + c

2022년 6월 6일
·
0개의 댓글
post-thumbnail

[JS 코딩 테스트] 준비 - 값 입력 받기

자바스크립트를 이용한 알고리즘 문제를 풀기 위해서는 다음과 같은 방식으로 해야합니다. 값 입력 받는 방법 1. 값을 입력 받기 위해서는 먼저 node.js의 file system 모듈을 불러옵니다. 2. fs 모듈의 readFileSync 함수를 통해 동기적으로

2022년 6월 6일
·
0개의 댓글
post-thumbnail

[알고리즘|자료구조] Big O notation(표기법)

Big O표기법은 알고리즘의 Time Complexity(시간 복잡도)를 나타내는데 주로 사용된다. Time Complexity 데이터 구조의 오퍼레이션 혹은 알고리즘이 얼마나 빠르고 느린지 측정하는 것 여기서 측정은 시간으로 하는 것이 아니라 얼마나 많은 단계(st

2022년 6월 5일
·
0개의 댓글
post-thumbnail

[React] useCallback, useMemo

useMemo와 useCallback에 대해 알아보기 전에 Memoization에 대해 알아야 합니다. 메모이제이션(Memoization)이란 메모이제이션은 알고리즘 시간에 자주 나오는 개념이라고합니다. memoization이란 기존에 수행한 연산의 결과값을 어딘가에

2022년 6월 4일
·
0개의 댓글
post-thumbnail

[React] Clean Code - 깔끔하고 더 나은 코드를 쓰는 방법

코드를 작성하다보면 순간순간 고민되던 부분들이 있습니다. 지금 내가 쓴 코드를 나중에 다시 보거나 다른 사람들이 읽었을 때 과연 쉽게 이해할 수 있을까라는 생각을 하다가클린코드라는 글을 읽고, 다시 정리하는 글을 쓰게 되었습니다. 하나의 상태만을 위한 상태 렌더링 만

2022년 5월 31일
·
0개의 댓글
post-thumbnail

[React] useNavigate / useParams / useLocation / useMatch

사용자가 다른 뷰로 이동 할 때 어플리케이션은 뷰를 동적으로 다시 그려줍니다.SPA는 MPA 대비 페이지 간 이동 시 사용자가 느낄 수 있는 딜레이를 제거해 더 나은 UX를 제공합니다.(= 페이지를 새로고침 하지 않습니다.)React는 라이브러리로 라우팅 시스템을 갖추

2022년 5월 30일
·
0개의 댓글
post-thumbnail

[React] React에 MediaQuery 적용하기

들어가기에 앞서 이 글은 Styled components의 themePorvider에 대한 기본적인 지식이 있어야하며, react-responsive 라이브러리 사용법에 대한 내용은 다루지 않습니다. 반응형 웹 (Responsive Web) 태블릿, PC, 모바일 등

2022년 5월 26일
·
0개의 댓글
post-thumbnail

[React] CRA 프로젝트에서 로컬 이미지 경로 설정하는 방법

공부를 하면서 주로 오픈 API를 가지고 했었는데,이번에 혼자 만든 개인 프로젝트를 하면서 처음으로로컬 이미지를 어떻게 CRA프로젝트에 가져와야하는지에 대해 고민을 하게 되었습니다.그리고 공부한 내용을 기록으로 남겨보려 합니다.webpack에 의해 관리되지 않습니다.

2022년 5월 24일
·
0개의 댓글
post-thumbnail

[GraphQL] Movie API 만들기(5)-Wrapping

영화 오픈 API를 통해 정보를 가져오도록 하겠습니다.axios 설치영화 API 링크db.js영화를 받기위한 url을 상수로 선언해줍니다.axios를 사용하여 api를 GET해줍니다.params: limit, rating을 넣어준 이뉴는 schema에 지정해주었기 때문

2022년 5월 8일
·
0개의 댓글
post-thumbnail

[GraphQL] Movie API 만들기(4)-Mutation

mutation은 Database 상태가 변할 때 사용되는 것입니다.개발자가 원하는 만큼 정의할 수 있고, 얼마나 많은 type을 정의했는지 상관하지 않습니다.하지만, Graphql에게 Mutaion이나 Query를 요청하길 원한다면 그것들을 type Query와 ty

2022년 5월 8일
·
0개의 댓글
post-thumbnail

[GraphQL] Movie API 만들기(3)-Schema

server를 생성했다면 nodemon이 서버가 정상적으로 작동 되고 있다는 메시지와 함께서버의 링크를 알려주는데 그 링크로 윈도우를 띄워보면 playgound를 볼 수 있습니다.강의 대로라면 localhost:4000으로 나와야하는데 저의 경우에는 0.0.0.0:40

2022년 5월 8일
·
0개의 댓글
post-thumbnail

[GraphQL] Movie API 만들기(2)-Server 생성

소개 [graphql-yoga 공식문서] (https://github.com/dotansimha/graphql-yoga) VScode extention : graphQL vscode IDE에서의 graphQL 적용을 위해 extension을 설치해 줍니다. Gra

2022년 5월 8일
·
0개의 댓글
post-thumbnail

[Redux] Toolkit

Redux Toolkit은 Redux의 공식 개발 도구입니다. Redux의 액션 생성자, 리듀서 자체는 단순한 함수인 데다 미들웨어를 추가할 수 있어서 관련 라이브러리와 도구가 매우 많고 그만큼 개발 방식이 다양합니다. 그래서 사용하다 보면 Redux가 좋긴 한데 액션

2022년 5월 6일
·
0개의 댓글
post-thumbnail

[GraphQL] Movie API 만들기(1)-개념

GraphQL GraphQL은 페이스북에서 만든 쿼리 언어입니다. 줄여서 gql은 웹 클라이언트가 데이터를 서버로 부터 효율적으로 가져오는 것을 목적으로 탄생하게 되었습니다. gql의 문장은 주로 클라이언트 시스템에서 작성하고 호출합니다. gql 쿼리 예시 서버사이

2022년 5월 4일
·
0개의 댓글
post-thumbnail

[Redux] 베이직

설치 core redux action 상태가 어떠한 변화가 필요할 때, action을 발생 시킵니다. action의 형태는 객체입니다. 그리고 action의 객체에는 type이란 필드가 필수로 들어가야합니다. type외의 다른 요소는 자율적으로 설정이 가능합니다.

2022년 5월 4일
·
0개의 댓글
post-thumbnail

[React] Framer Motion

Framer Motion React에서 사용할 수 있는 production-ready 모션 라이브러리 입니다. 공식 홈페이지 공식 GitHub 설치 react 버전4를 사용하는 분들은 CRACO를 이용해 에러를 해결하세요. CRACO(Create React App

2022년 4월 20일
·
0개의 댓글
post-thumbnail

[React] react-beautiful-dnd

react-beautiful-dnd React로 아름답고 접근성이 좋은 그래그 앤 드롭 리스트를 만들 수 있도록 도와주는 패키지 입니다. 설치 DragDropContext DragDropContext는 기본적으로 드래그앤드롭을 가능하게 하고 싶은 앱의 한 부분입니다

2022년 4월 8일
·
0개의 댓글
post-thumbnail

[React] Recoil - State Management

Set up 명령어를 실행시켜주면 끝! How to use Atom.ts 파일 생성 useRecoilValue() atom으로부터 값을 불러올 때 사용합니다. useSetRecoilState() atom의 값을 변경할 때 씁니다. useRecoilState()

2022년 4월 7일
·
0개의 댓글
post-thumbnail

[React] React Hook Form

React Hook Form 사용하기 쉬운 유효성 검사를 통해 성능이 뛰어나고 유연하며 확장 가능한 form입니다. 공식문서 보기 사용하는 법 React-hook-form 설치하기 명령어를 입력해주세요. Form register register 예약어를 사용하면

2022년 4월 7일
·
0개의 댓글