[React 1๋ถ] ๋ง๋ค๊ณ ๋น๊ตํ๋ฉฐ ํ์ตํ๋ React
์ด์ ๋ฆฌ์กํธ(React)๋ฅผ ์ ๋๋ก ๋ฐฐ์ฐ์ธ์. ์์ ์๋ฐ์คํฌ๋ฆฝํธ ๋ฐฉ์๊ณผ ๋น๊ตํ๋ฉฐ, ๋ฆฌ์กํธ์ ํน์ง๊ณผ ์ญํ ์ ๊ฐ์ฅ ์ฝ๊ฒ ์ดํดํ๋ ๊ฐ์!
์๊ฐ์ 2,006๋ช
๋์ด๋ ์ด๊ธ
์๊ฐ๊ธฐํ ๋ฌด์ ํ

- ๋ฏธํด๊ฒฐ
๋ฆฌ์กํธ 1,2๋ถ ์ดํ ํ์ ๊ฐ์๋ ์ค๋น ์ค์ธ ๋ค๋ฅธ ๊ฐ์๊ฐ ์์ผ์ ๊ฐ์?
๊ฐ์ฌ๋, ๋ฆฌ์กํธ 1๋ถ ๊ฐ์๋ฅผ ๋๋ฌด ์์ฐจ๊ฒ ์๊ฐํ ํฐ๋ผ์ธํ๋ฐ์ ์ฌ๋ฆฌ์ ๋ฆฌ์กํธ 1,2๋ถ์ ํ์ ๊ฐ์๋ ์ค๋น ์ค์ธ ๋ค๋ฅธ ๊ฐ์ ๊ณํ์ด ์๋ ์ง ๊ถ๊ธํฉ๋๋ค.
javascriptreact์น์ฑmvcmosara999
ใป
7๋ฌ ์
1
90
2
- ๋ฏธํด๊ฒฐ
super.show() ํธ์ถํ๋ ์ด์ ๊ฐ ๊ถ๊ธํฉ๋๋ค.
์๋ ํ์ธ์, ๊ฐ์ ์ ๋ฃ๊ณ ์์ต๋๋ค.23๊ฐ์์ SearchFormView ํด๋์ค์ show ๋ฉ์๋ ์ค๋ฒ๋ผ์ด๋ฉ๊ณผ ๊ด๋ จํ์ฌ ๊ถ๊ธํ ์ ์ด ์๊ฒจ์ ์ง๋ฌธ๋๋ฆฝ๋๋ค.// SearchFormView.
javascriptreact์น์ฑmvcleeebug
ใป
7๋ฌ ์
1
81
2
- ํด๊ฒฐ
class์ constructor๋ฅผ ์ด์ฉํ ๊ฐ์ฒด ์งํฅ ํ๋ก๊ทธ๋๋ฐ
์๋ ํ์ธ์ ๊ฐ์ฌ๋ ๋ฐ๋๋ผ ์๋ฐ์คํฌ๋ฆฝํธ๋ก ํ๋ก์ ํธ๋ฅผ ์งํํ ๋ class๋ฅผ ์ด์ฉํด์ ์ด๋ฅผํ ๋ฉด, export default class SearchFormView extends View {
reactmvc์ด์ฌ์
ใป
0
224
2
- ํด๊ฒฐ
mvc ํจํด ์ง๋ฌธ
์๋ ํ์ธ์ ๊ฐ์ฌ๋ ๊ฐ์๋ ๋จ์ผ ํ์ด์ง์ ๋ํด์ mvc ํจํด์ ์ก์ ๋ํ๋์ ํ์ด์ง๋ฅผ ๋์์ผ๋ก controller views helpers.js, main.js, storage.js, Store.js๋ฅผ ๋ง๋์ จ๋๋ฐ
reactmvc์ด์ฌ์
ใป
0
197
2
- ๋ฏธํด๊ฒฐ
Cannot read properties of undefined (reading 'props')
<img src="https://cdn.inflearn.com/public/files/posts/0e262d71-0c95-4896-837e-3c25367a602d/c55e645c-813f-4abe-86fb-ec75e167c0fc.png" media-type="img"
reactmvc๋ฐํธ์
ใป
0
270
2
- ๋ฏธํด๊ฒฐ
delegate, emit ํ์ํ ์ด์
์๋ ํ์ธ์. delegate์ emit ํจ์์ ํ์์ฑ์ด ์ ์๋ฟ์ง ์๋๋ฐ, ์ ํ์ํ๊ฑธ๊น์?
reactmvc๋ฐํธ์
ใป
0
196
2
- ๋ฏธํด๊ฒฐ
์ด๋ค๊ฑฐ๋ฅผ ๋จผ์ ๋ค์ด์ผ ํ๋์ง ๋์์ฃผ์ธ์
์๋ ํ์ธ์์ฐ์ํํ์ ๋ค ํ๋ก ํธ์๋ ์๋์ด ๊ฐ๋ฐ์์ ์น ๊ฐ๋ฐ ๋ก๋๋งต ๊ฒฐ์ ๋ฅผ ํ๋๋ฐ, ๋ฆฌ์กํธ1 ๋ถํฐ ๋ค์ด๋ ๋ ๊น์? ์๋๋ฉด ์ด๋ค ๊ฐ์๋ถํฐ ๋ค์ด์ผ ํ๋์? ์ถ์ฒ์ ํด์ค ์ ์์๊น์? ํ๋ก ํธ์ ๋ํด์ ์์ ๋ชจ๋ฅด๋ ์ํ ์ ๋๋ค.
reactmvcJS๊ณ์ ๊น์ํ ๋ชฉํ
ใป
1
265
1
- ๋ฏธํด๊ฒฐ
localhost:8080 ์ ์ ๋ถ๊ฐ
์๋ ํ์ธ์ ์ ์๋๋ฆฌ์กํธ ํ๋ก์ ํธ๋ฅผ ๋ณธ๊ฒฉ์ ์ผ๋ก ํ๊ธฐ ์ํด npm i -> npm start๋ก loc
reactmvc์ด์ฌ์
ใป
1
282
1
- ๋ฏธํด๊ฒฐ
์ต๊ทผ๊ฒ์์ด 3 ํ์ด์์
์๋ ํ์ธ์ ์ ์๋ ์์ ์๋ฃ๊ณ ์์ต๋๋ค.๋ค์ ์์ค์ด ๋์ ์์ ์ด๋ผ ์กฐ๊ธ ํค๋งค๊ณ ์์ง๋ง์..์ต๊ทผ ๊ฒ์์ด 3์์ 2๋ถ 41์ด ๊ฒฝ์store js์์ 15๋ฒ์งธ ์ค search(keyword) {<p
reactmvc์ด์ฌ์
ใป
1
188
1
- ๋ฏธํด๊ฒฐ
import ๋ฌธ์
์๋ ํ์ธ์. ๋จผ์ ์์ ์ ๋ฃ๊ณ ์์ต๋๋ค ๐ 6:41 ๋ถ๋ถ์์ import ๋ฌธ์ ๊ฐ ๋ฐ์ํ๋๋ฐ main.js ๊ธฐ์ค์ผ๋ก helpers.
reactshkim8170
ใป
1
232
1
- ๋ฏธํด๊ฒฐ
์๋๋ณํ ๊ด๋ จ
[๊ฒ์ํผ 1] ์ ๋ ฅ ๊ฐ์ ๊ธฐ์ตํ๊ธฐ - State ๊ฐ์์์ 2๋ถ 32์ด์ฏค์ type="text" placeholder="๊ฒ์์ด๋ฅผ ์ ๋ ฅํ์ธ์" aut
reactmvchtkim
ใป
1
203
1
- ๋ฏธํด๊ฒฐ
sort() ์ง๋ฌธ ๋๋ฆฝ๋๋ค.
์๋ ํ์ธ์.์ต๊ทผ ๊ฒ์์ด ๊ตฌํ ์ค Store.js์์ ์คํ ๋ฆฌ์ง์ historyData๋ฅผ ๋ฐ์์์ sort๋ฅผ ํ ๋,๊ฐ์์์ ๋์ค๋๋๋ก > ๋ถ๋ฑํธ๋ก ํ๋ฉด ์ ๋ ฌ์ด ๋์ง ์๊ณ - ๋ฅผ ํด์ค์ผ ๋ด๋ฆผ์ฐจ์์ผ๋ก ์ ๋ ฌ์ด ๋ฉ๋๋ค.
reactmvcํ์ง์
ใป
1
304
2
- ๋ฏธํด๊ฒฐ
reset ์์ ์ searchResult ๋น ๋ฐฐ์ด๋ก update
์๋ ํ์ธ์. ์ด๋ฒ ์์ ์์ ์ฌ์ํ? ๊ถ๊ธ์ฆ์ด ์๊ฒจ์ ์ง๋ฌธ ๋จ๊น๋๋ค! handleReset() { this.setState(() => { r
reactmvcํ๋ค๊ฑฐ๋ถ์ด
ใป
2
311
2
- ๋ฏธํด๊ฒฐ
Button์ Onclick์ฌ์ฉ
{this.state.searchKeyword.length > 0 && (<button type="reset" className="btn-reset" onClick={even
reactmvcming9
ใป
1
247
1
- ๋ฏธํด๊ฒฐ
npx lite-server error ํ์ธ ์์ฒญ๋๋ฆฝ๋๋ค.
git ํ๋ก๊ทธ๋จ์์, code ํ์ธ ํ์npx lite-server --baseDir 1-vanilla ์คํํ๋ฉดnpm ERR! code ENOENTnpm ERR! syscall lstatnpm ERR! path C:\Users\ostri\AppData\Roaming\n
reactmvcdevocean
ใป
1
470
2
- ๋ฏธํด๊ฒฐ
node 20์ด์ ์ธ๋ ๊ฟํ
package.json์์ "scripts": { "start": "export NODE_OPTIONS=--openssl-legacy-provider && webpack serve", "build": "we
reactmvcdohyun_lim
ใป
4
759
3
- ํด๊ฒฐ
๋๋ฒ๊น ๊ด๋ จ์ง๋ฌธ์ด ์์ต๋๋ค.
์๋ ํ์ธ์ ์ ์๋ ์ง๋ฌธ์ด ์์ต๋๋ค.์ ๊ฐ ์๋ฐ, ์คํ๋ง๋ง ํด์ intellij ide ๋ก ๋๋ฒ๊น ๋ง ํด๋ณด์๋๋ฐ ์ด๋ฐ react๊ฐ์ ๊ฒฝ์ฐ๋ ์ด๋ป๊ฒ ํด์ผํ๋์?ํ์ฌ๋ console.log๋ก ๋๋ฒ๊น ํ์์ต๋๋ค. ps
reactmvcdohyun_lim
ใป
1
295
1
- ๋ฏธํด๊ฒฐ
[์์JS2]ํญ 3(ํ์ด) ์ง๋ฌธ์์ต๋๋ค.
์๋ ํ์ธ์ ์ ์๋ ๊ฐ์ ์ ๋ฃ๊ณ ์์ต๋๋ค.delegate์ ๊ดํด์ ์ ๊ฐ ์๋์ฒ๋ผ[(1),(2)] ์ดํดํ๊ณ ์๋๋ฐ ์ด๊ฒ์ด ๋ง๊ฒ ์ดํดํ๊ฒ์ธ์ง ๊ถ๊ธํฉ๋๋ค. 1) delegate์์emitEvent์ ๋ด๊ธฐ๋๊ฒ์ ์์ง ํธ์ถ๋์ง
reactmvcdohyun_lim
ใป
1
229
1
- ํด๊ฒฐ
์ถ์ํ๋ฅผ ์ด๋ป๊ฒ ๋ฐ์๋ค์ด๋ฉด ๋ ๊น์??
์๋ ํ์ธ์.๊ฐ์ ๋ฃ๋ค๋ณด๋ฉด ์ ์๋๊ป์ ์ถ์ํ๋ผ๋ ๋ง์์ ์์ฃผ ํ์๋๋ฐ์ํ๋ก๊ทธ๋๋ฐ์์ ์ถ์ํ๋ผ๋ ๋ง์ด ์ ์๋ฟ์ง๊ฐ ์์ต๋๋คใ ใ ์ ์๋ ๊ฐ์ ์ธ์๋ ๋ค๋ฅธ ๊ฐ์๋ ์์ ๋ค๋ ๋ณด๋ฉด ์ถ์ํ๋ผ๋ ๋ง์ด ๊ฝค ๋์ค๋๊ฑธ ๋ณผ ์ ์๋๋ฐ ๊ทธ๋๋ง๋ค ์ถ์ํ
reactmvcangels6312
ใป
1
435
1
- ํด๊ฒฐ
[๊ฒ์ํผ 1] View.js ํ์ผ ์ง๋ฌธ๊ณผ ํ์ต ์ง๋ฌธ
์๋ ํ์ธ์. ๊ฐ์ ๋ฃ๊ธฐ ์์ํ ์๊ฐ์ ์ ๋๋ค ใ ใ ๊ฐ์ ๋ฃ๊ธฐ์ ์ ์ฝ๋๋ ํ๋ฒ ์ดํด๋ณด๊ณ ๊ฒ์ํผ 1๊ฐ์๋ ๋ค์๋๋ฐ์์๋ฌด๋ฆฌ ๋ด๋ View.js ํ์ผ์์ class ๋ด๋ถ์ constructor์ ๋งค๊ฐ๋ณ์๋ก ์ ๋ฌ๋๋ element๊ฐ ๋ญ์ง ์ ๋ชจ๋ฅด๊ฒ ์ต
mvcangels6312
ใป
1
329
1






