profile
2년차 프론트앤드

[FE] 쿠키, 세션, 캐시

인터넷상에서 데이터를 주고 받기 위해 서버/클라이언트 모델을 따르는 통신규약.HTTP 프로토콜은 연결이 유지시키지 않고(connectionless) 상태가 없는(stateless) 특성을 가지고 있다. 즉, 서버가 클라이언트의 요청에 응답을 하는 순간 HTTP 연결은

2023년 1월 1일
·
0개의 댓글
·

[FE] 브라우저 렌더링 원리

https://d2.naver.com/helloworld/59361사용자가 브라우저를 통해 웹사이트에 접속하면, HTML, JS, CSS, 이미지, 폰트 파일 등 렌더링에 필요한 리소스를 요청하고 서버에서 응답받는다. 서버로부터 내려받으면 브라우저의 렌더링 엔

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

[Diary] 2022년 회고록

2022년이 지나면서 개발경력 2년이 꽉 차게 되었다.React-native를 다루면서 모바일 앱을 새로 제작했다.확실히 React를 다루는 숙련도가 올라갔다.kubernetes를 공부했다. (CKA 준비중)백엔드 서버랑은 좀 친해졌다.개인공부 거의 안했다. (개인프로

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

[Typescript] tsconfig 컴파일 옵션 정리

}}

2021년 7월 28일
·
0개의 댓글
·

[Nextjs] nextjs+typescript 셋팅하기

nextjs 설치npx create-next-apptypescript설치시 기본적으로 설치해야 하는 것typescript@types/react@types/nodeesling, prettier 사용시 기본적으로 설치해야 하는 것.prettier@typescript-esl

2021년 7월 23일
·
0개의 댓글
·

[React] 2차인증 input 구현하기

2차 인증 페이지를 만들다가 리서치한 구현방법;input에서 정해진 자리숫자가 다 차면 옆의 input으로 움직이는 기능을 구현해야 했다.그래서 구글 검색을 통해 알아 본 것과 짬뽕시켜서 구현해 보았다.추가로 input의 화살표(증감, 가감 기능의 버튼)를 없애는 cs

2021년 7월 20일
·
0개의 댓글
·

[MySQL] mysql 및 sequelize 사용법(1)

시퀄라이즈 설치 시퀄라이즈 초기화 model생성 이렇게 만들면 model폴더에 index.js와 users.js 파일이 생긴다. 동시에 migrations폴더에 {날짜}-create-users.js 파일도 동시에 생김. model/index.js model/u

2021년 6월 30일
·
0개의 댓글
·

[Nextjs] nextjs 11.0.0 버전 eslint 사항

nextjs가 11.0.0 버전 부터는 eslint에 설정을 따로 해줘야 한다.안그러면 실행할때나 빌드할때 eslint가 적용이 안되서 에러가 뜬다.밑에 주소를 통해 따라하면 된다.https://nextjs.org/docs/basic-features/eslin

2021년 6월 30일
·
0개의 댓글
·

[MySQL] MySQL 데이터베이스, 테이블 명령어

데이터베이스 - 폴더테이블 - 파일컬럼 - 컨텐츠이렇게 구조를 생각하면 편하다.데이터베이스 목록보기사용할 데이터베이스 선택데이터베이스 생성데이터베이스 삭제테이블 생성테이블 구조보기테이블 삭제테이블 새로운 필드추가이렇게 하면 마지막위치로 필드가 추가가 되는데, 어떤 특정

2021년 5월 3일
·
0개의 댓글
·

[Javascript] 스크린 영역 드래그 및 이미지 캡쳐와 다운로드

순수 자바스크립트로 드래그 한 영역을 이미지로 캡쳐하여 다운로드를 해 보았다.html2canvas라이브러리를 같이 사용해야 한다.위의 코드에서는 배경을 div의 배경색이 아니라 border의 두께값을 계산하여 검은 색상을 채웠다. 배경색상을 넣으면 캡쳐된 내용물이 가려

2021년 4월 27일
·
0개의 댓글
·
post-thumbnail

[React] react-hook-form 사용하기

react-hook-form은 form형식의 컴포넌트들을 좀 더 편하게 구현할 수 있도록 만든 라이브러리이다.글을 작성한 이유는 다양한 input타입을 react-hook-form으로 만드는 방법을 기록해 놓기 위해서 이다. 게다가 react-bootstrap의 스타일

2021년 4월 18일
·
0개의 댓글
·

[환경설정] eslint 세부 설정

이를 해결하는 방법.eslintrc.json 파일에서 { "endOfLine": "auto"} 를 추가해 준다.

2021년 4월 17일
·
0개의 댓글
·

[Nextjs] eslint와 prettier 설정하기

CRA의 경우 기본적으로 ESLint 세팅이 다 되어 있다고 함. 그러나 Nextjs는 다 설치해 줘야 한다.현재 Airbnb 에서 정의한 자바스크립트 규칙이 많이 사용된다고 한다.다음과 같이 명령어를 입력하면 무엇을 설치해야 하는지 알 수 있다.우선 설치해야 하는 기

2021년 4월 17일
·
0개의 댓글
·

[Nextjs]1. nextjs와 typescript 를 같이 시작하기

폴더의 루트경로에다가 next-env.d.ts 파일을 생성한다.이 파일이 있어야 그 다음에 실행했을 때 tsconfig.json파일을 알아서 생성해준다.nextjs에 맞는 typescript를 설정해 주는 듯 하다.실행하면 알아서 typescript를 감지하고 tsco

2021년 4월 17일
·
0개의 댓글
·