profile
매일 기록을 해보려 합니다

간단한 프로젝트들

🚀 토이 프로젝트22.7.1 부터 팀프로젝트를 진행하기 앞서, 그전에 타입스크립트를 공부하며 redux-toolkit도 더 익숙해지고, js문법도 더욱 잘 쓰기 위해서, 레포를 하나파서 간단한 쇼핑몰을 하나 만들어 보려한다~!api는 찾아보다 보니 fake stor

2022년 6월 24일
·
0개의 댓글

typescript 기초 문법 공부하기

요즈음은 typescript를 많이들 사용한다.typescript란 무엇인지 알아보자typescript는 javascript의 상위 집합 언어이다.

2022년 6월 23일
·
0개의 댓글

TIL - 2

페이지네이션 서버에서 많은 데이터가 존재하고 이 데이터들을 전체적으로 보여줄 때 프론트에서는 한 페이지 안에서 많은 데이터를 받아와서 한번에 보여주는 것은 많은 시간이 소모되어 좋지 않을 뿐더러 UX에도 좋지 않다 따라서 인피니티 스크롤 or 페이지네이션을 이용해서

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

TIL - 1

🚀 TILlocalStoragelocalStorage를 사용해서 현재 하고 있는 프로젝트를 구성하고 마치 localStorage를 서버처럼 사용하는 것으로 바꿔볼 생각이다. localStorage를 사용한지 시간이 조금 지난 것 같아서 그에 대해서 정리도 하고 자유롭

2022년 5월 27일
·
0개의 댓글

TIL - DIARY - 0

하나의 프로젝트를 배포하는 과정을 공부하고, 튼튼히 다져가며 발전하기위해서 js deep-dive도 보며 js문법과 동작과정을 공부하고 있었는데,SPA 를 바닐라 js로 구현하려면 어떻게 해야할까 ? 라는 생각이 들어서,,구글링도 엄청 하고 프로그래머스에 마침 SPA

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

React 로그인 유지하기

next에서는 getServerSideprops를 통한 서버사이드렌더링을 하여 로그인 유지를 쉽게 할 수 있다.그렇다면 csr을 할때에는 어떤식으로 로그인을 유지해야 할까?어떤식으로 유지를 해야하는가에 대한 공부를 하기 위해서는 세션 or 쿠키에 대한 이해가 있어야 한

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

Js study

객체를 프로퍼티 값으로 갖는 객체의 경우 얕은 복사는 한 단계까지만 복사하는 것을 말하고 깊은 복사는 객체에 중첩되어 있는 객체까지 모두 복사하는 것을 말한다.깊은복사얕은복사 렉시컬 스코프는 상위스코프가 동적으로 변하지 않고 함수 정의가 평가되는 시점에 상위 스코프가

2022년 5월 19일
·
0개의 댓글

functions are not valid as a react child 에러

오늘은 개인플젝을 진행중에 하나의 에러를 발견했다.이런 실수를 하지 않기 위해 작성을 한다.functions are not valid as a react child...이 구문으로 시작되는 에러인데,렌더링 되어야 하는데 실행이 되지 않아서 나오는 에러이다.예시코드이런식

2022년 5월 19일
·
0개의 댓글

react useEffect

한동안 전역 상태 관리를 주로 해서 클론 코딩을 하거나 간단한 것들을 만들었더니, 바보같이도 리액트의 기본적인 useEffect가 정확히 어떻게 작동하는지를 잠시 망각 ? 하고 살았던 것 같다.요즈음 디자인 라이브러리 없이 마크업 연습도 하고, 리액트는 기본이고 추가로

2022년 5월 18일
·
0개의 댓글

java script

취업을 하기 위해 사람들은 효율적이고 빠른 길을 찾는다.하지만 클린 코드의 작성자는 이런 말을 했다고 한다.빨리 가는 유일한 방법은 제대로 가는 것이다.물론 js를 안하고 react 와 next를 하고 있는 것은 아니지만, 복기하며 내가 방학 때 할 팀프로젝트를 잘 준

2022년 5월 11일
·
0개의 댓글

next ssr

next를 쓰는 주된 이유는 서버 사이드 렌더링 때문이다.서버 사이드 렌더링이란 무엇인지 부터 정확히 개념을 짚고 넘어가보자.서버 사이드 렌더링클라이언트에서 요청을 하면 html 리소스를 서버로 넘기고 서버에서 데이터를 받아와 html이 완료되고 이를 다시 클라이언트로

2022년 5월 9일
·
0개의 댓글

React-nodebird #7

cookie 설정은 프론트엔드 개발자가 흔히들 빼먹는 부분이라고 한다.쿠키란 무엇인가 ?정보가 있고, 그 정보를 저장하기 위해 사용하는 것이라고 생각하면 될 것 같다.예를 들어 로그인 정보등이 대표적이다.아래는 정확하게 쿠키가 사용되는 과정을 복기하기 위해서 타 블로그

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

React-nodebird #

오늘은 바보같은 실수를 해서 시간을 많이 잡아먹은 일이 있어서, 이런 실수를 줄이고 앞으로 이런 실수가 나온다면 오류를 찾는 시간을 줄이기 위해서 기록을 하고 있다.유저 게시글의 팔로우 / 언팔로우를 클릭한다면 게시글의 유저 id를 현재 로그인한 유저의 Followin

2022년 5월 2일
·
0개의 댓글

React-nodebird - Infinite scoll

infinite scroll ?ex) CRUD 게시판을 생각해보면 게시글이 있고 이 게시글을 보여주는 list page가 있을 것이다.리스트가 적을 때는 상관 없지만 실서비스에서 수십수만개가 된다면 어떻게 될까 ?한번에 수많은 데이터를 서버에서 들고와서 사용해야되기 때

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

React-nodebird -05

현재 내가 만들고 있는 트위터 비슷한 이 노드버드 프로젝트에는 사람들이 게시글을 올릴 수 있고, 그 게시글에는 기본 글 외에도 이미지,해쉬태그 등을 올릴 수 있을 것이다.이미지 작업을 해보자.우선 post reducer의 맨 처음 게시글에는 3종류의 이미지를 넣어주었다

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

React-nodebird-04

더미데이터의 중요성프론트엔드 개발자는 백엔드 쪽과 연동하여 데이터를 주고 받기 전에는 데이터를 완전히 저장하는 것에는 한계가 있다.하지만 브라우저가 종료되기 전에는 localStorage, store 등을 이용해 데이터를 저장할 수 있는데,결국에는 후에 백엔드에 데이터

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

React-nodebird-03

우선 next.js에서 next-redux-wrapper를 사용하는 이유는 무엇인가 ?이것이 궁금해진 이유는 react에서 createStore를 이용해서 리덕스 스토어를 사용하는 반면 next에서는 createWrapper을 사용하고 createStore도 마찬가지로

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

React-nodebird 02

2장에서는 ant design 을 이용한 기본적인 틀을 구성한다.공식문서를 보고 형식변환만 해서 사용하면 되기 때문에 크게 어려움은 없었던 것 같다. 우선 antd와 styled-components를 사용하기 위해서 npm을 이용한다.(사용법은 많이 나와있으니 생략)주

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

React-nodebird-01

next.js 기본 npm init 부터 기본설정을 해보려 한다. 나는 리액트 공부를 할때 주로 CRA를 썼었는데 필요없는 것들이 많이 들어있어 무겁기도 하고 처음부터 제대로 설정하는 법을 인지하는 것과 못한 것의 차이는 크다고 생각이 든다. 처음 패키지명을 작성하

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

React-nodebird - 00

리액트 노드버드 강의를 구입하고 클론 코딩 후 수많은 오류들을 마주했었는데 순간순간 인지하고 해결하고 넘어갔었는데 복습도 하고, 내가 분명 가볍게 넘어간 부분들도 있기 마련이기에 강의를 빠르게 들으며 흐름 정도만 파악하고 혼자 진행해보려고 한다. 우선 강의는 React

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