profile
한 걸음 한 걸음 계속 걷는 자가 일류다
태그 목록
전체보기 (91)JavaScript(20)error(16)React(11)git(7)mongodb(7)mongoose(6)CSS(5)회고록(5)redux(5)svg(4)method(3)githubpages(3)Node(3)axios(3)aws(3)reactnative(3)CRUD(2)convention(2)ASP(2)AndroidStudio(2)cookie(2)next.js(2)자료구조(2)CS(2)html(2)naver login(2)android(2)github(2)schema(1)indexOf(1)snackbar(1)popup(1)stroke-dasharray(1)library(1)객체지향프로그래밍(1)PRE(1)stack(1)queue(1)애자일(1)agile(1)S3(1)query builder(1)lazyloading(1)gradiant(1)multer(1)skip(1)stroke-dashoffset(1)oAuth(1)generator(1)iterator(1)RTK Query(1)path(1)Emulator(1)PORT(1)rect(1)componentdidupdate(1)blur(1)polyline(1)하이브리드 앱(1)404(1)getServerSideProps(1)next-redux-wrapper(1)Firebase(1)Prototype(1)Xcode(1)match(1)parseInt(1)number(1)windowpopup(1)class(1)웹앱(1)toast(1)ellipse(1)includes()(1)store(1)방법론(1)디버깅(1)Viewport(1)ESLint(1)Prettier(1)Debouncing(1)webfonts(1)aggregate(1)polygon(1)login(1)access token(1)Hydrate(1)ec2(1)REST API(1)JWT(1)publishing(1)browserpopup(1)compoenentWillUnmount(1)reudx-saga(1)Paging(1)pdf(1)require(1)readme(1)filter(1)iOS(1)conflict(1)regex(1)OCR(1)GoogleFonts(1)toLowerCase(1)toUpperCase(1)String(1)option(1)Google Cloud Platform(1)commit(1)Group(1)createStore(1)1054(1)Sort(1)HTTP protocol(1)window(1)apache(1)count(1)rtk(1)history(1)tofixed(1)cordova(1)styled components(1)fonts(1)reset(1)SSR(1)LINE(1)background image(1)NAMING(1)split()(1)명령어(1)gitignore(1)redux extention devtools(1)layerpopup(1)extends(1)super(1)pm2(1)pull(1)translate(1)substr(1)toString(1)seo(1)VISION(1)slice(1)viewBox(1)LIMIT(1)리눅스(1)array(1)endswith(1)startswith(1)ES6(1)componentDidMount(1)Android Studio(1)iis(1)trim()(1)modal(1)charAt(1)vscode(1)session(1)pwa(1)static(1)redux-devtools(1)git clone(1)animation(1)kakao login(1)circle(1)interceptors(1)math(1)인증방식(1)substring(1)proto(1)import(1)Sequelize(1)lookup(1)npm(1)

5. 검색 디바운싱

검색 기능 구현에 있어서 디바운싱(debouncing) 이라는 개념을 적용하였다. 연이어 호출 되는 함수들 중 마지막 함수만 호출 하도록 하는 것으로 주로 ajax 검색에 사용 된다.검색 창에 검색어를 입력 시 바로 결과를 보여주려면 검색 창 input에 onCha

약 21시간 전
·
0개의 댓글
·

4. Next13 버전 문제로 직면한 에러

npx create-next-app 으로 프로젝트를 세팅을 시작하는데, 터미널 창에서 이런 물음이 나왔다.Use App Router (recommended)? No / YesApp Router가 무엇인가에 대해 찾아보니, Next13부터는 기존의 page 디렉토리 기

2일 전
·
0개의 댓글
·

3. RTK, RTK-query 사용기

RTK 와 RTK-query 관련 일화는 더 많지만 뒤에 SSR 포스트와 더 연관 있어서, 일단 이번 포스트에서는 찾아봤었던 사용법 몇 가지와 발생했던 에러 해결에 대해 이야기 하겠다.전체 코드는 여기를 확인하길 바란다.영화 데이터를 가져오기 위해서 header에

5일 전
·
0개의 댓글
·
post-thumbnail

2. firebase authentication

백앤드 서버 없이 간단하게 로그인을 구현 하고 싶어 firebase를 사용하였다. 다양한 로그인 방식을 지원 하는데 그 중에서 구글 로그인 방식을 사용하였다. firebase 콘솔 설정 방법과 코드 적용 방법에 대해서 이야기 하겠다. 프로젝트 추가 클릭프로젝트 이름

5일 전
·
0개의 댓글
·
post-thumbnail

1. 프로젝트 소개 및 시작

typescript도 공부했고, state 관리 라이브러리들도 공부 했고 이를 활용한 프로젝트를 하나 하고자 생각하여 TMDB API를 사용하여 디즈니 플러스 클로닝 애플리케이션을 제작 하였다. 프로젝트는 여기로 접속 가능하다. ReactTypescriptNext.j

5일 전
·
0개의 댓글
·
post-thumbnail

JWT (JSON Web Token)

JSON 형식의토큰을 주고 받으면서 인증 하는 방식토큰을 헤더에 실어 서버가 클라이언트를 식별 할 수 있도록 함.기존의 세션 인증 방식을 보완한 방법Header : 해시 알고리즘 등의 메타 정보 포함Payload : key:value 형식의 정보Signature: H

2023년 5월 20일
·
0개의 댓글
·
post-thumbnail

OAuth

like 구글 로그인 기능웹 서버에 구글 비밀번호를 제공하지 않고도, 구글 계정의 일부 접근 권한을 부여 할 수 있음.SNS 간편 로그인 기능사용자가 서버에 구글 아이디와 패스워드를 보냄 서버에서 구글로 로그인 요청구글 에서 서버로 정보 보내줌서버에서 사용자에게 로그인

2023년 5월 19일
·
0개의 댓글
·
post-thumbnail

[error] fatal: refusing to merge unrelated histories

main branch에 다른 branch( branch명 “typescript”)를 merge 하는 상황 에서 다음과 같은 에러가 나와, merge가 실행되지 않음.typescript branch의 시작이 main branch로부터 시작하지 않았기에 unrelated

2023년 5월 11일
·
0개의 댓글
·
post-thumbnail

쿠키 와 세션

사용자가 특정한 웹 사이트에 방문할 때, 사용자 컴퓨터에 저장하는 기록 파일서버의 자원을 전혀 사용하지 않음.ex) 아이디와 비밀번호를 저장 하시겠습니까? , 팝업 오늘 하루 열지 않기 한 명의 사용자(브라우저)의 상태를 유지하는 기술서버가 클라이언트에게 고유한 Ses

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

History 객체

브라우저의 히스토리 정보를 문서와 문서 상태 목록으로 저장하는 객체등록된 history 갯수이동 시, 스크롤 위치 복원 여부 지정 하는 옵션auto : 기본 값, 새로고침 해도 이전 스크롤 위치 그대로 유지 함.manual : 새로고침 시, 무조건 스크롤 최상단으로 이

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

npm

npm = Node Package Manager 말 그대로 노드 패키지를 관리해주는 틀.

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

Styledcomponents background-image넣기

✍️ styled components 에서 background-image를 적용하려고 하니 css처럼 경로를 입력하니 적용이 안되어 찾아 보았다.

2023년 4월 29일
·
0개의 댓글
·
post-thumbnail

[error] github pages favicon

github Pages 를 이용해 사이트를 호스팅 하였는데, favicon이 보이지 않았다. (로컬에서는 정상적으로 잘 나타남.)

2023년 4월 29일
·
0개의 댓글
·
post-thumbnail

github README 작성

✍️ 과제 하면서 README를 써야 됬어서 찾아 본 것을 토대로 정리해보았다. 찾아본 것을 토대로 업그레이드 하면서 수정해 나가야겠다. (README를 쓰고 있는 내 자신 좀 멋지다. 😼)

2023년 4월 22일
·
0개의 댓글
·

정규표현식

✍️ 입력 폼 검증할 때 주로 많이 사용 하는 정규표현식, 매번 찾아 볼 때 마다 언젠가 정리 해야지 해야지 하다가 드디어 지금 한다. 메서드와 주로 사용하는 패턴에 대해 정리해 보았다.

2023년 4월 22일
·
0개의 댓글
·

AWS EC2 포트 설정

✍️ 어플리케이션을 80 포트가 아닌 다른 포트로 배포를 해야 되는 상황에서, 에러가 발생해 찾아보다가 AWS에서 포트 설정을 따로 해줘야 한다고 한다. 그 과정을 기록해보았다.

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

[error] EACCES: permission denied 0.0.0.0:80

AWS EC2 서버를 사용하여 배포하고자 하는 상황. 다음과 같이 80 포트가 거부되는 에러가 발생했다.

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

axios interceptors

✍️ 로그인에 성공하고, api 요청을 할 때, 매번 요청 할 때마다 인증 문제로 토큰을 헤더에 넣어서 보내야 했는데, 이 상황 이 불편하여 개선하고자 찾아보다가 발견하였다. interceptor의 기본 정의와 사용 방법 그리고 필자의 상황에 따른 적용 방법을 기록

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

[error] github pages 404 error

✍️ 1번 방법은 유지보수 까지 고려했을 경우, 적합한 방법 이고, 2번 방법은 직관적으로 추가 패키지 설치 없이 간단하게 실행 할 수 있는 방법이다.

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

github pages 배포하기

✍️ create-react-app을 이용해 제작한 어플리케이션을 배포해야 되는 상황이었는데, githubpages를 사용 해보자 하여 방법을 정리해 보았다.

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