hyungju-lee
categories
daily-issue
2021-06
2021-07
2021-08
2021-09
2021-10
2021-11
2021-11
develop
dev
study
algorithm
1 기본문제
database - mongoDB
1 소개
2 MongoDB 맛보기
3 NodeJS & Express를 활용한 REST API 만들기
4 비동기(Asynchronous) 프로그래밍
5 NodeJS로 MongoDB 다루기
database - mysql
1 MySQL 다운로드 및 설치
2 MySQL 기본
3 MySQL 테이블의 생성
4 MySQL CRUD
5 더 배워보기
development environment
1 개발환경 구성
gatsby
1 Gatsby 알아보기 및 개발 환경 구성하기 - Gatsby란 무엇일까?
1 Gatsby 알아보기 및 개발 환경 구성하기 - Gatsby를 위해 필수로 알아야 할 기술
2 Gatsby 알아보기 및 개발 환경 구성하기 - Gatsby 프로젝트 생성하기
3 Gatsby 알아보기 및 개발 환경 구성하기 - TypeScript 개발 환경 구성하기
4 간단하게 페이지 띄워보기 - TypeScript로 컴포넌트 작성하기
5 간단하게 페이지 띄워보기 - GraphQL Query 알아보기
6 간단하게 페이지 띄워보기 - Gatsby에서의 페이지 이동 방법
7 글 목록을 띄워 줄 메인 페이지 구현하기 - EmotionJS 라이브러리란 무엇일까?
8 글 목록을 띄워 줄 메인 페이지 구현하기 - EmotionJS 라이브러리를 통한 컴포넌트 스타일링 방법
9 글 목록을 띄워 줄 메인 페이지 구현하기 - 메인 페이지의 기본적인 틀 만들기
10 글 목록을 띄워 줄 메인 페이지 구현하기 - 카테고리 목록 컴포넌트 구현하기
11 글 목록을 띄워 줄 메인 페이지 구현하기 - 게시글 목록 부분 컴포넌트 구현하기
12 글 목록을 띄워 줄 메인 페이지 구현하기 - 메인 페이지 반응형 디자인 구현하기
13 메인 페이지에 실제 데이터 띄워보기 - Markdown 파일을 사용하기 위한 라이브러리 세팅하기
14 메인 페이지에 실제 데이터 띄워보기 - Markdown 파일 추가 후, GraphQL Query 확인해보기
15 메인 페이지에 실제 데이터 띄워보기 - 메인 페이지에서 Props로 받아 포스트 데이터 출력하기
16 메인 페이지에 실제 데이터 띄워보기 - gatsby-plugin-image 라이브러리로 최적화된 썸네일 사진 띄워주기
17 메인 페이지에 실제 데이터 띄워보기 - 카테고리 생성 및 카테고리별로 포스트 아이템 띄워주기
18 메인 페이지에 실제 데이터 띄워보기 - 인피니티 스크롤 기능 구현하기
19 포스트 아이템 링크를 만들어 해당 게시글 페이지 연결하기 - Slug에 대해 알아보고, 데이터 추가해보기
20 포스트 아이템 링크를 만들어 해당 게시글 페이지 연결하기 - 포스트 아이템 링크 연결 및 게시글 페이지 생성하기
21 포스트 아이템 링크를 만들어 해당 게시글 페이지 연결하기 - 템플릿 컴포넌트 내에서 Slug에 맞는 데이터 조회하기
22 게시글 페이지 구현하기 - 메인 페이지와 중복되는 부분 분리하기
23 게시글 페이지 구현하기 - 게시글 페이지 상단 부분 구현하기
24 게시글 페이지 구현하기 - 마크다운 형식의 포스트 출력하기
25 게시글 페이지 구현하기 - Utterances 위젯 추가하기
26 게시글 페이지 구현하기 - 게시글 페이지 반응형 디자인 구현하기
27 404 에러 페이지 구현하기 - 404 에러 페이지의 중요성
git-beginner
1 시작
2 기초
3 기본
4 협업
git-beginner2
1 Git과 버전 관리
2 Git & GitHub 시작하기
3 Git & GitHub 다지기
4 실무 사례와 함께 Git 정복하기
javascript deep dive
0 들어가며
1 프로그래밍
2 자바스크립트란?
javascript mdn
0 타입 구조도 / Number
1 String
2 이외의 타입들 null, undefined, truthy, falsy
3 변수 (variables)
4 연산자 (Operators)
5 식 및 연산자
jekyll blog 만들기 다시 정리
1 jekyll blog 만들기
2 jekyll blog 만들기
3 jekyll blog 만들기
JSON
0 JSON
1 JSON 개요
nodejs
1 노드 시작하기
2 알아두어야 할 자바스크립트
3 노드 기능
4 http 모듈로 서버 만들기
5 패키지 매니저
6 익스프레스 웹 서버 만들기
7 MySQL
8 몽고디비
객체 지향 프로그래밍 입문
0 객체 지향 프로그래밍 입문
1 객체
2 추상화
3 상속보단 조립
4 기능과 책임 분리
5 의존과 DI
6 정리
7 부록, DIP 소개
react storybook
1 Introduction
2 tutorial - start
3 tutorial - writing
4 tutorial - heirarchy, story, args
5 tutorial - Decorators
6 tutorial - Theme
7 tutorial - Addons
8 tutorial - Console Addon
9 tutorial - Docs Addon
10 tutorial - Knobs Addon
11 tutorial - Viewport Addon
12 tutorial - a11y Addon
13 tutorial - Environment variables
14 tutorial - Building Storybook
풀스택 리액트 토이프로젝트 - REST, GraphQL
0 Intro
1 Client - 기본기능 구현
2 Server - REST API
3 Client - REST API 통신
4 Server - GraphQL
5 Client - GraphQL 통신
6 Client - GraphQL 무한스크롤
7 기타 library 소개
8 Outro
typescript advanced
1 고급 타입
2 맵드 타입(Mapped Type)
3 최종 프로젝트 안내
4 최종 프로젝트 - 프로젝트 구성 및 타입 시스템 적용
5 최종 프로젝트 - 점진적인 타입 적용
6 모듈화 진행을 위한 프로젝트 환경 구성 안내
7 최종 프로젝트 - 외부 라이브러리 모듈화
8 최종 프로젝트 - API 함수 타입 정의
9 최종 프로젝트 - 차트 라이브러리 타입 정의
10 최종 프로젝트 - ES6+ 문법
11 최종 프로젝트 - 엄격한 타입 적용
12 마무리
typescript beginner
1 강의 오리엔테이션
2 타입스크립트 소개와 배경
3 타입스크립트 시작하기
4 타입스크립트 기초 - 변수와 함수 타입 정의하기
5 첫번째 프로젝트 - 할 일 관리 애플리케이션
6 인터페이스
7 타입 별칭 (Type Aliases)
8 연산자를 이용한 타입 정의
9 이넘(Enums)
10 클래스
11 제네릭 (Generics)
12 두번째 프로젝트 - 전화번호부 애플리케이션
13 타입 추론 (Type Inference)
14 타입 단언 (type assertion)
15 타입 가드
16 타입 호환 (Type Compatibility)
17 타입 모듈화
LV1. vue.js 시작하기 Age of vue.js
1 개발환경 설정
2 vue.js 소개
3 인스턴스
4 컴포넌트
5 컴포넌트 통신 방법 - 기본
6 컴포넌트 통신 방법 - 응용
7 라우터
8 HTTP 통신 라이브러러 - axios
9 템플릿 문법 - 기본
10 템플릿 문법 - 실전
11 프로젝트 생성 도구 - Vue CLI
12 싱글 파일 컴포넌트
13 최종 프로젝트 - 사용자 입력 폼 만들기
14 마무리
LV2. vue.js 중급강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
0 강의 오리엔테이션
1 Todo App - 프로젝트 소개 및 구성
2 Todo App - 프로젝트 구현
3 Todo App - 애플리케이션 구조 개선하기
4 Todo App - 사용자 경험 개선
5 강의 중간 정리
6 ES6 for Vue.js - 오리엔테이션
7 ES6 for Vue.js - const & let
8 ES6 for Vue.js - 화살표 함수
9 ES6 for Vue.js - Enhanced Object Literals
10 ES6 for Vue.js - Modules
11 Vuex - 소개
12 Vuex - 주요 기술 요소
13 Vuex - 헬퍼 함수
14 Vuex - 프로젝트 구조화 및 모듈화
LV3. vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
0 강의 오리엔테이션
1 제작할 앱 & API 소개 & Vue.js 스타일 가이드 소개
2 — 애플리케이션 제작 파트 — 소개 및 설계
3 — 애플리케이션 제작 파트 — 프로젝트 셋업
4 — 애플리케이션 제작 파트 — 라우터 기본
5 — 애플리케이션 제작 파트 — API 구현
6 — 애플리케이션 제작 파트 — 스토어 구현
7 — 중간 정리 —
8 라우터 실전
9 리팩토링 1 - 리스트 아이템 컴포넌트 공통화
10 리팩토링 2 - 사용자 프로필 컴포넌트 공통화
11 리팩토링 3 - Mixin과 하이 오더 컴포넌트
12 리팩토링 4 - 데이터 호출과 UX
13 리팩토링 5 - async & await를 이용한 비동기 처리
14 –애플리케이션 실전 파트– 외부 라이브러리 모듈화 방법(차트)
15 –애플리케이션 실전 파트– 컴포넌트 디자인 패턴
16 –애플리케이션 실전 파트– 서비스 배포 환경 구성
LV4. Vue.js 끝장내기 - 실무에 필요한 모든 것
0 강의 오리엔테이션
1 개발환경 구성
2 프로젝트 생성 및 환경 구성
3 라우터 & 컴포넌트 설계
4 회원 가입 페이지 개발
5 실무 환경을 위한 프로젝트 설정
6 로그인 페이지 개발
7 로그인 상태 관리와 스토어
8 토큰을 이용한 API 인증 처리
9 학습 노트 데이터 조회
10 브라우저 저장소를 이용한 인증 값 관리
11 학습 노트 데이터 생성
12 중간 정리
13 API 함수 모듈화
14 학습 노트 데이터 삭제
15 학습 노트 데이터 수정
16 데이터 포맷팅
17 라우터 심화
18 프론트엔드 테스팅 소개
19 강의 마무리
LV5. vue.js + TypeScript 완벽 가이드
0 강의 오리엔테이션 및 개발환경 설정
1 첫 번째 프로젝트 시작하기
2 할 일 관리 앱 - 추가 기능 구현
3 할 일 관리 앱 - 조회 기능 구현
4 할 일 관리 앱 - 삭제 기능 구현
5 할 일 관리 앱 - 완료 기능 구현
6 할 일 관리 앱 - 정렬 기능 구현
7 첫 번째 프로젝트 요약
8 두 번째 프로젝트 시작하기
9 실 서비스에 타입스크립트를 적용하는 방법 2가지
10 점진적인 타입스크립트 적용 방식 1단계 - 라우터, HOC, 유틸 함수
11 점진적인 타입스크립트 적용 방식 2단계 - 컴포넌트, API 함수
12 점진적인 타입스크립트 적용 방식 3단계 - Vuex 스토어 타입 정의
13 두 번째 프로젝트 요약 정리
14 뷰 플러그인과 외부 라이브러리 타입 정의
vue.js 하면서 알게된점
1 이름을 가지는 라우트
2 params VS. query
3 v-model 어떻게 생겼을까? v-model 원리
4 v-model, v-on, slot, template 코드분석
5 v-slot은 template 태그에만
6 Vue JS 히스토리 대응 (뒤로가기)
7 input file upload and drag drop
8 vue animationend and transitionend
9 vue watch deep handler
10 v-model - controlled component
11 api 통신 - 데이터 받아온 후 - 적용되는 컴포넌트 - 여기서 등록되는 이벤트 에러 조심!!
12 vue validator - vee-validate
13 vue.config.js devServer의 proxy, changeOrigin 설정
14 vee-validate code refactoring
15 proxy
16 i18n
17 잠시만… 프록시 설정.. 대안 생각남
18 vue에 storybook 기능 추가하기
19 webpack-spritesmith 각 폴더 이름에 맞게 mixins 함수 생성
20 객체 반복문 안쓰고 비교하기 - 중요
21 storybook에서 컴포넌트 정리할 때
22 vue - webpack-spritesmith 라이브러리 적용 내용 공유
23 vue storybook
24 nvm이란?
25 vue vuetify
26 vue-timepicker
27 개발 실패한 컴포넌트 - range (결국 Vuetify 활용 - 단 IE에서 작동하는지 봐야됨)
28 기초적인 실수 하지말자 Deep Copy!!!!
29 vuetify 속성 포함 안되도록 하는 방법!! 이 방법밖엔 없는듯..
30 vue-toasted 라이브러리 사용
31 deep copy
32 vue $set, $nextTick
33 vuetify 같은 라이브러리가 react에도 있나?
34 vue keep-alive 컴포넌트
35 Git fork 원래 저장소와 동기화 방법
36 vue에서 swiper 사용하기
37 사용자 지정 directive
38 window fullscreen API
39 풀스크린 해제시 이벤트 등록
40 폼 입력 바인딩
41 사용자 지정 inputs
42 slot이 있는 콘텐츠 배포
43 props type 유효성 검사(validator)
44 조건부 렌더링
45 리스트 렌더링
46 파이프 필터
47 overlayscrollbars, ngrok
48 ajax
49 javascript 꿀팁
50 overlayScrollbars scroll 이벤트
51 vue-fragment with v-if 이슈
52 lottie 및 v-icon
53 vuetify v directive custom 속성
54 컴포넌트화 할 것들은 컴포넌트화 아닌 것들은 inline scoped style로
55 chart.js
56 moment.js
57 eslint, prettier, stylelint, editorconfig
58 왜 CommonJS는 번들사이즈를 크게 하는가?
59 트리 쉐이킹으로 자바스크립트 페이로드 줄이기
60 실제 적용 후기
61 eslint 기능 강화 (prettier, stylelint) 및 git hook 기능 추가
62 빌드시 tree-shaking 기능 강화
63 코드 최적화 적용 결과
64 vuetify, lodash 트리쉐이킹
65 Scoped CSS
66 git 특정 파일만 특정 시점으로 되돌리기
67 error: src refspec master does not match any
68 2021-09-07 ~ 2022-01-07 금 중간체크 - 4개월간 해온 것들
69 git 권한 문제
70 zshell 에서 nvm 인식 안되는 문제
71 router-link, redirect 리서치
72 뷰 라우터 기본개념잡기
73 router-link active class, active 방법에 관한 고찰..?
74 라우터 이동에서 컴포넌트 이동으로 수정 후 버그 픽스
75 vuetify v-icon 사용법
76 vuetify 컴포넌트 안에 vuetify 컴포넌트 props 전달
77 유지보수 - 페이지별 class 조정
78 dropdown box 원리
79 postman 활용 연구
80 tooltip 기능
81 combobox 유효성 검사
82 vue에서 sass 기능 사용?
83 webpack에서 loader와 plugins의 차이점은 무엇인가요?
84 local storage VS session storage (텝메뉴)
85 IE 접속 이슈
86 vue.js dynamic component, json, storyblok
87 IE 이슈 (재귀함수, 호출 스텍 크기, 자동취소(?))
88 현재 api 구조 - 토스트 팝업 뜨는 구조 이해하기 (ㅇㄹ등록메시지 일치할 때)
89 storyblok - 헤드리스 CMS
90 - storyblok VueJS
91 MVVM
92 프론트 최적화 - 랜더링 횟수
93 JSON 데이터에 따른 문서 템플릿
94 input type number & maxlength
95 IE 11 두번째 이슈
96 vee-validate 동적 생성
97 CSS module, scoped
98 컴포넌트 단위에 관하여..(vueJS 관점)
99 반복문 key 값에 관한 고찰..
100 slot, scope
101 keep-alive, component
102 intro 페이지 내가 개발한 스크롤 플러그인 적용
103 vee-validate IE11에서 immediate 옵션 안줬는데 즉시 유효성 검사되는 이슈
104 부모 태그에 맞춰 img 정렬하기 object-fit: cover 기능 구현
105 moment.js
106 async/await 실행순서
107 객체 해체할당
108 스토리북 addon - 화면에 보이는 것들 조정
109 리액트 - 이미지 레이지로드
110 리액트 - 이미지 레이지로드2 상위 컴포넌트에서 레이지로드 함수 관리, 하위 컴포넌트로 레이지로드 함수 전달해서 코드 간단하게하기
111 React Router로 렌더링하는 컴포넌트에 prop 전달하기
112 로띠는 네트워크 리퀘스트가 아니다. 빌드하면 소스에 다 포함되어 나간다.
113 git tag
114 git token 설정하기 - 깃 보안강화
115 특정 파일 commit 기록보기
116 tag push
117 특정파일 unstaged로 돌리기
118 react 빌드 파일 로컬 서버에서 실행하기
119 Vue filter
120 Vue에서 moment 사용하기
121 딥카피(deep copy) 관련 이슈
122 Vue 파이프 필터
123 웹팩 데브 프록시 설정 (webpack devServer proxy)
124 eslint 기능 강화
125 window node localhost 제대로 안종료되었을 때
126 vue keep-alive 컴포넌트
127 Git fork 원래 저장소와 동기화 방법 (upstream)
128 vee-validate 3점대 버전 (vue 2점대버전이라..) (정리중..)
129 chart.js 3버전 (이거 많이쓰니깐 잘 알아둬야돼..) (정리중..)
130 내가 만든 스크롤 인터렉션 플러그인.. vue에서 쓰게끔 수정하니깐 갑자기 IE11에서 IndexSizeError가 뜬다.
131 타입스크립트 리서치
132 타입스크립트 리서치 2
133 웹소켓 개념
134 Object key 순서
135 IE 11 이슈 - stack overflow, chart.js 3.x
136 IE11 순환참조 발생하는 원인 파악중.. 파악 방법 리서치
137 엣지 케이스 처리 - $root, $parent, $refs, provide, inject, 프로그래밍 방식 이벤트 리스너, Circular References
138 member 권한 파악
139 vuetify, vuedraggable, + @ IE11 이슈, chart.js 3.6.4, chartjs-plugin-zoom 1.2.0
140 파트별 텝메뉴 나타나는거 수정
141 로그인 관련
142 IE11 이슈 - swiper + video + poster + controls // transform scale opacity
143 vue2 개발환경 구성
144 DockerFile, Kubernetes - 배포 시스템 관련 설명
145 타입스크립트 리서치 3 - vue2 적용
146 vue2 프로젝트 세팅
147 api 개발 (login 및 login 정보로 토큰받기 및 공통 api 요청)
148 ngrok 사용
149 라우터, 라이프사이클 훅
150 도커 배포시 오류
151 vuetify v-textarea 스크롤 이벤트
152 크로스사이트 스크립팅 (공격코드) - XSS
153 2022. 03. 31. (목) 해야될거
154 xss 공격방어 관련 v-html 사용 x
155 숫자를 base64 인코딩해주는 자바스크립트 내장 함수 (btoa / atob)
156 public/robots.txt
157 vuetify v-text-field 한글입력 방지
158 전화번호 형식으로 변경 (정규식)
159 초기값 관련
160 프론트엔드 개발 이슈
161 프론트엔드 정리 1
162 무한 스크롤링 이슈
163 고민 - 로딩 컴포넌트 제어 방법, 컴포넌트는 어떤 구조로 정리하면 좋을까 (링크드인)
164 dev, cbt 배포 에러 yml
165 쿼리스트링
166 vue 배포 파일 용량 큰 문제 해결
167 kakao developer
168 반복문 잘쓰자!!!
169 vue composition api 주의점
170 vue 반복문 key 값 주의
171 key, package.json scripts, skeleton ui, vue3 suspense component, element ui (is-esm), 임시저장 기능 구현, 트러블 슈팅 경험, 페이지 진입속도 해결, 프로젝트 진행하며 어려웠던 점, 앞으로 적용하고 싶은 것, 로딩 컴포넌트 제어, axios / swr
172 vue, react 등 프론트 프레임워크에서 반복문시 할당하는 Key 프롭에 관해.. (vue3 DOC 기준이지만, 내용읽어보니 vue2도 이에 해당하는듯..? 아닌가)
172-1 리스트 렌더링
172-2 API Reference: 특별한 속성들
173 vue.js 렌더링에 관해 - slot
174 스로틀링, 디바운스, requestAnimationFrame
175 Vue.js의 렌더링에 관해 - 가상 DOM
176 vue.js
177 portal-vue, teleport
178 프론트엔드 최적화
179 Vue는 React보다 얼마나 쉽게 최적화 컴포넌트를 만들 수 있을까?
180 forceUpdate 말고 key를 통해 재랜더링 시키는 방법 및 고유값 생성 방법
181 Promise.all, Promise.allSettled
182 vue awesome swiper 4.1.1
183 조건은 확실하게 다 달자
184 2022년 6월 11일 스터디 때 할 거
185 v-dialog eager 렌더링
186 Scoped slot
187 Input type=file
188 응답 느린 서버
189 안드로이드 카카오 인앱 브라우저 QR 스캐닝 이슈
190 react usememo
191 2021/09/07 ~ 2022/06/24 그동안의 기록들..
vue 원리
0 뷰 원리
1 컴포넌트
2 웹팩
3 반응속도 체크 게임
4 뷰 라이프사이클
5 vue 스타일 가이드
6 Vue 관련 지식 - 틱택토 만들기(삼목) 2차원 배열 연습에 좋음
7 지뢰찾기 만들기
8 vue 라우터, 히스토리 라우터, 동적 라우트 매칭, 주소 쿼리스트링
vue 프로젝트
0 뷰 프로젝트
1 뷰 프로젝트
2 뷰 라우터 설정
3 컴포넌트 Basic
4 Mock 서버 준비하기
5 서버 데이터 바인딩 실습
6 컴포넌트 심화 학습
7 Reusability & Composition
8 Proxy 사용하기
9 Vuex (v4.x)
10 프로젝트 배포하기
11 미니프로젝트: 로그인 처리
vue 리서치
0 뷰 리서치
1 뷰 리서치
10 뷰 리서치
2 뷰 리서치
3 뷰 리서치
4 뷰 리서치
5 뷰 리서치
6 뷰 리서치
7 뷰 리서치
8 뷰 리서치
9 뷰 리서치
vue 입문
vue 입문
developer’s quality
0 quality - utility
1 quality - javascript
1 webpack 기본강의
Test Prism
1. Prism Test
Test Documentation
1. Markdown Elements
2. Toasts Card
3. Code Blocks
4. Mermaid Test
5. Emoji Test
6. Gist Test
7. Avatar Test
8. Mentions Test
9. Fonts Test
10. Mathjax Test
11. Primer Utilities Test
This is an incredibly long caption for a long menu
I’m folder1
file1
file2
file3
I’m folder2
file1
file2
file3
I’m folder1
file1
file2
file3
I’m folder2
file1
file2
file3
I’m folder1
file1
file2
file3
hyungju-lee
categories
study
nodejs
README.md
nodejs
source:
categories/study/nodejs/README.md
1 노드 시작하기
2 알아두어야 할 자바스크립트
3 노드 기능
4 http 모듈로 서버 만들기
5 패키지 매니저
6 익스프레스 웹 서버 만들기
7 MySQL
8 몽고디비
Next
2022,
hyungju-lee
Revision
28c9313
Built with
GitHub Pages
using a
theme
provided by
RunDocs
.
hyungju-lee
master
GitHub
Homepage
Issues
Download
This
Software
is under the terms of
MIT License
.