<aside> ๐Ÿ’ก All things to be a good front-end engineer : codebase, best practices, lectures & books, setup guides, and more!

</aside>

Codebase


ECMAScript 6

Functional Programming with ES6+

Typescript

React

React + Typescript

TypeScript & OOP

Next.JS

Redux, Redux-toolkit, MobX

XState

Svelte.js

Node.js

Three.js

SVG, Flex, Grid

Best practice


ํ”„๋ก ํŠธ์—”๋“œ ์•„ํ‚คํ…์ฒ˜์— DDD ๋„์ž…ํ•˜๊ธฐ

ํฌ๋กค๋Ÿฌ๋กœ Authorization token ๊ฐฑ์‹ ํ•˜๊ธฐ

[SWR + React + Socket.io ํ”„๋กœ์ ํŠธ](https://fongfing.notion.site/SWR-React-Socket-io-3a7d83f574d14e58a434729babcaa545)

Next.js + React ํ”„๋กœ์ ํŠธ

๊ฒฌ๊ณ ํ•œ ์†Œํ”„ํŠธ์›จ์–ด ๋งŒ๋“ค๊ธฐ(TDD)

React-summernote ๋„์ž…๊ณผ ์ด๋ฏธ์ง€ ์—…๋กœ๋“œ ์ด๋ฒคํŠธ ์ปค์Šคํ…€ (onImageUpload)

JS ์—”์ง„ ๊ตฌํ˜„

Lectures & Books


React ํ™˜๊ฒฝ์—์„œ ์›น ์„ฑ๋Šฅ ์ตœ์ ํ™”ํ•˜๊ธฐ

์šฐ์•„ํ•œ ํ…Œํฌ๋Ÿฌ๋‹ : React & TypeScript

React์™€ Redux๋กœ ๊ตฌํ˜„ํ•˜๋Š” ์•„ํ‚คํ…์ฒ˜์™€ ๋ฆฌ์Šคํฌ ๊ด€๋ฆฌ

๋ชจ๋‘๋ฅผ ์œ„ํ•œ ์ปดํ“จํ„ฐ ๊ณผํ•™(CS50 2019)

์›น ํ”„๋กœ๊ทธ๋ž˜๋ฐ(ํ’€์Šคํƒ)

Docs


์ผ ํ•˜๋‹ค ๋ฌธ๋“

์•Œ๊ณ ๋ฆฌ์ฆ˜