profile
총총

[eCommerce Project-1]

오늘의 목표 [v] 레포지토리 생성 [ ] 레이아웃 [ ] 로그인 [ ] 회원가입 [ ] 메인페이지 [ ] 권한분기 1. 레포지토리 생성 이 레포지토리를 vscode와 연결해주었다. git init을 하기 전에 혹시 몰라서 ls -al을 해보니 .git 파일이 있

약 9시간 전
·
0개의 댓글
·
post-thumbnail

TIL[40일차]마지막 수업. 프론트엔드의 미래, 깃으로 협업하기

데이터 패칭으로 데이터를 패칭해서 보여주는건 모바일웹이 대부분이다.안드로이드는 괜찮지만 ios에서는 막았다가 허용을 해서 더더욱 활용도가 높아진다고 한다. 홈페이지를 만들고 => 모바일 웹을 만들고(웹과 모바일의 순서가 바뀔수도 있음) => PWA를 추가해서 모바일앱으

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

Memoization

state를 쓰면 리렌더링이 되기 때문에 위에서 똑같은게 다시 만들어진다. 이렇게 state할때마다 재렌더링 되는건 불필요하다. Memoization이란? 컴퓨터 프로그램이 동일한 계산을 반복해야 할 때, 이전에 계산한 값을 메모리에 저장함으로써 동일한 계산의 반복 수

2022년 12월 22일
·
0개의 댓글
·

Cookie, Session, Local Storage

Cookie, Session, Local Storage는 브라우저에 저장할 수 있는 저장공간의 종류이다.브라우저 저장소로 Cookie와 Web Storage가 있다. Cookie와 Web Storage 모두 해당 도메인과 관련된 데이터를 클라이언트 웹브라우저에 저장할

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

React HOC vs HOF

(aaa())()aaa를 실행한 결과값을 다시 실행한다.이러면 bbb를 실행한 것과 같다. aaa()()로 줄여 사용이 가능하다. aaa가 실행되고 bbb가 실행된다. aaa를 bbb보다 먼저 실행되기 때문에 Higher order Function(먼저 실행되는 함수)

2022년 12월 22일
·
0개의 댓글
·

JS Closure

클로저 전에 우선 스택과 큐라는 데이터 구조를 알아보자.stack은 출입구가 하나이기에 나중에 들어간 함수가 가장 먼저 나오는 lastInFirstOut 구조이다. (LIFO 구조)queue는 출입구가 나눠진 파이프 형태로 가장 먼저 입력된 함수가 가장 먼저 빠져나가는

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

권한분기

로그인 인증 이후에는 로그인 상황에 따른 권한 분기를 하게 되는데 예를 들어 로그인을 한 사람과 로그인을 하지 않은 사람, 운영자로 로그인한 사람, 판매자로 로그인한 사람, 거래처사장님으로 로그인한 사람 등 다양하게 권한을 분리한다.useEffect로 권한이 없다면 로

2022년 12월 22일
·
0개의 댓글
·

Javascript vs Typescript

Javascript와 Typescript의 차이점은 무엇일까요?사실 크게 다르지는 않지만 가장 큰 다른점이 있습니다.바로 타입을 지정한다는 점입니다.이게 타입스크립트를 처음 공부하면서 가장 까다로웠던 점인거같습니다.타입이 뭐냐? 하면 우리가 흔히 문자열은 string타

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

useRef

javascript를 사용할 때 특정 DOM에 접근해서 변경하고 싶다면queryselector이나 getElementId를 활용합니다. react에서는 이런 기능을 useRef로 할 수 있습니다.우리가 어떤 페이지에 들어갔을 때 input에 포커스 되어야하는 경우가 있

2022년 12월 22일
·
0개의 댓글
·

Pagination vs Infinite Scroll

게시판에서 글을 보여주는 방법중에 글 목록을 한페이지씩 보여주는 페이지 네이션과 스크롤 하면 무한으로 스크롤이 내려가면서 목록을 보여주는 무한 스크롤방식이 있습니다. 이 두 방식을 사용하는 방법을 알아봅시다. 페이지네이션이란 페이지번호를 클릭해서 이동하는 방식의 페이지

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

async / await

동기 / 비동기 통신 rest-API 또는 graphql-API 를 사용해서 해야할 일은 요청에 대한 응답으로 받은 객체(JSON)를 변수에 담아서 사용하는 것입니다. 여기서! 응답 결과를 변수에 담아서 사용하려면! 통신이 완료될 때까지 기다려야 합니다! asyn

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

Rest-API vs GraphQL-API

API API란 HTTP 요청을 Back-end 컴퓨터에 보냈을때 실행되는 Back-end 기능입니다. Front-end에서 HTTP라는 길을 통해서 게시물 데이터를 Back-end에 보내 저장시켰습니다. 만약, 게시물이 아닌 프로필 데이터를 저장하고 싶으면 어떻

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

GIT 에 대해 알아보자

사실 git은 나에게 좀 어렵다고 느껴졌다. 처음에는 복잡한 터미널 창에 뭘 그렇게 치는거지? 싶고 왠지 찐 개발자(?)같이 멋있어보였다. 하지만 생각보다 자주 쓰는 애들은 정해져 있었고, 금방 외울 수 있었다. 내가 어려웠던건 깃을 활용해 전으로 돌아가거나, 깃그래프

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

TIL[36일차]배포 흐름

오늘은 배포 이론이다. 배포 전에 봐야하는 건 테스트다. 이제까지 해왔던 기능들이 자라 작동되는지 볼 것이다. 이 과정을 통해 테스트 코드를 만들어서 테스트를 자동화 하는 방법 테스트와 배포로 이번시간은 생각하면 되겠다. 도메일을 만들어야한다. 구매하면 된다. 내가

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

TIL[34일차]낙관적인 Optimistic-UI

좋아요를 클릭하면 원래는 많은 단계가 있지만 아폴로캐시에서 미리 다음 숫자를 생각해서 미리 보여주고 요청을 하고 데이터베이스에서 변경을 한다. 쉽게말해 좋아요가 8이 있다면 눌렀을때 9가 되겠지 하고 예상해서 누르면 9로 바뀌게 먼저 보여주는 것이다. 만약 백엔드나 디

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

Optimistic-UI

Optimistic-UI란?낙관적 UI는 UI에 바쁜 스피너를 표시하지 않고 애플리케이션이 서버에서 데이터를 변경하는 사용자 상호 작용에 즉시 응답하는 것처럼 느끼게 하는 패턴입니다. 처리할 서버로 만드는 데 시간이 좀 걸리더라도 UI에 충분한 정보를 보내서 가짜로 보

2022년 12월 15일
·
0개의 댓글
·

observable

비동기 작업을 도와주는 도구로 Promise와 Observable이 있다. Promise는 비동기 작업을 도와주고, Observable은 연속적인 비동기 작업을 도와준다. 차이는 연속적인 이다. 우리가 댓글이나 게시글을 올리거나 버튼을 누르는 행위를 할 때 빠르게 연

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

TIL[32일차] Memo해놓자! Memoization, 브라우저 렌더링 원리로 성능을 개선하자!

state 렌더링 원리 state를 쓰면 리렌더링이 되기 때문에 위에서 똑같은게 다시 만들어진다. 이렇게 state할때마다 재렌더링 되는건 불필요하다. 불필요한 재렌더를 막는 방법. useMemo라는걸 사용한다. >사용법 useMemo(() => Math.rand

2022년 12월 13일
·
0개의 댓글
·

TIL[24일차]. Hydration, HOC/HOF, 권한분기

Next.js렌더링 원리 access token은 브라우저에서 해당 주소를 입력하고 엔터치는 순간 프론트 서버에 접속해서 HTML/css/js 를 다운받아 브라우저에 그려진다. 로그인을 클릭하면 백앤드에서 실제 로그인을 한 뒤 access token을 받아 브라우저로

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

JSX

JSX란 무엇일까. 한번쯤 JSX, JSX 하는걸 들어보았지만 오늘 한 번 제대로 알아보자. js가 들어가 있으니 자바스크립트와 관련있어 보인다. 이건 자바스크립트를 확장한 문법이다.즉 문법이고 형식이 있다. 규칙도 있다. JSX란?JSX(JavaScript XML)는

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