์ฐ์ํ ํ ํฌ๋ฌ๋
-
โ ์ฐ์ํ ํ ํฌ๋ฌ๋ 3๊ธฐ: React & TypeScript 6ํ์ฐจ์ฐ์ํ ํ ํฌ๋ฌ๋ 3๊ธฐ 2020. 9. 20. 20:45
โ 9์17์ผ (๋ชฉ) ์ฐ์ํ ํ ํฌ๋ฌ๋ 3๊ธฐ 6ํ์ฐจ ๊ฐ์ ์ ๋ฆฌ ๐ 6ํ์ฐจ ๊ฐ์ ๋ชฉํ webpack์ ๋ํ ํ๋ฆ ์ดํดํ๊ธฐ React & Typescript ์ดํด๋ณด๊ธฐ redux-saga ์ฌ์ฉํ๊ธฐ ๐ Webpack ํ๋ฆ ์ดํดํ๊ธฐ Webpack์ Webpack Cli๋ผ๊ณ ํ๋ ๋๊ตฌ๊ฐ ์กด์ฌํ๋ค. ๋จ์ง Hello world๋ฅผ ์ฐ๊ธฐ ์ํด์ ํ์ํ ์ค์ ๋ค์ด ์ด๋ ๊ฒ๋ ๋ง์ด ํ์ํ๋ค @babel/core๊ณผ ๊ฐ์ @๊ฐ ๋ถ์ฌ์ ธ ์๋ ๊ฒ๋ค์ ํธ๋์คํ์ผ๋ง ํ ๋ ์ฌ์ฉ๋๋ค. ์ผ์ข ์ ํ๋ก๊ทธ์ธ์ด๋ค. webpack์ webpack.config.js๋ผ๋ ์ด๋ฆ์ ๊ฐ๋ ์ค์ ํ์ผ์ ๊ฐ๋๋ค. ์ด๋ฆ ๋ณ๊ฒฝ๋ ์ ์์ง๋ง ๊ด๋ก์ ์ผ๋ก ์ฌ์ฉ๋๋ค. webpack์ webpack.config.js์ฝ์ด์ ์คํ์์ผ์ฃผ๋๋ฐ ์คํ์์ผ์ค ๋ config๊ฐ์ฒด๋ฅผ export..
-
โ ์ฐ์ํ ํ ํฌ๋ฌ๋ 3๊ธฐ: React & TypeScript 5ํ์ฐจ์ฐ์ํ ํ ํฌ๋ฌ๋ 3๊ธฐ 2020. 9. 19. 19:03
โ 9์15์ผ (ํ) ์ฐ์ํ ํ ํฌ๋ฌ๋ 3๊ธฐ 5ํ์ฐจ ๊ฐ์ ์ ๋ฆฌ ๐ 5ํ์ฐจ ๊ฐ์ ๋ชฉํ javascript๋ก ๋ง๋ Redux ๋ฆฌ๋ทฐ Redux์ ๋น๋๊ธฐ Redux ๋ฏธ๋ค์จ์ด ์์๋ณด๊ธฐ ๐ป Redux ๋ฆฌ๋ทฐ 2ํ์ฐจ๋ ๋ง๋ ๋ฆฌ๋์ค๋ฅผ ์ฌ์ฉํ์ฌ store์ reducer ์์ฑ ํด์ค๋ค. ์์ธํ ๋ด์ฉ์ ์ ๋งํฌ ์ฐธ์กฐ ๐ index.js import { createStore } from "./redux"; function reducer(state = { counter: 0 }, action) { switch (action.type) { case "inc": return { ...state, counter: state.counter + 1 }; default: return { ...state }; } } const store = ..
-
โ ์ฐ์ํ ํ ํฌ๋ฌ๋ 3๊ธฐ: React & TypeScript 4ํ์ฐจ์ฐ์ํ ํ ํฌ๋ฌ๋ 3๊ธฐ 2020. 9. 11. 23:26
โ 9์10์ผ (๋ชฉ) ์ฐ์ํ ํ ํฌ๋ฌ๋ 3๊ธฐ 4ํ์ฐจ ๊ฐ์ ์ ๋ฆฌ ๐ 4ํ์ฐจ ๊ฐ์ ๋ชฉํ ๐ป React ์ปดํฌ๋ํธ์ ์ํ์ ๊ด๋ฆฌ ๐ฏ ์ปค๋ฎค๋์ผ์ด์ !! ๐ค ๋น๋๊ธฐ์ ์ ๋๋ ์ดํฐ ํ์ ์คํฌ๋ฆฝํธ๋ ๋ค์์ฃผ๋ถํฐ! ๐คฉ ๐ React ์ปดํฌ๋ํธ์ ์ํ์ ๊ด๋ฆฌ React ์ ํ๋ฆฌ์ผ์ด์ ์ ๋ง๋ ๋ค. index.jsimport React from "react"; import ReactDOM from "react-dom"; ReactDOM.render( , document.getElementById("root") ); App.jsimport React from "react"; const App = () => { return ( React and TypeScript 1ํ์ฐจ: Overview 2ํ์ฐจ: Redux ๋ง๋ค๊ธฐ 3ํ์ฐจ: React ๋ง๋ค๊ธฐ ..