๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
๋ฐ˜์‘ํ˜•

JavaScript168

@ : ์ ˆ๋Œ€ ๊ฒฝ๋กœ(root)๋ถ€ํ„ฐ ์‹œ์ž‘ import HelloWorld from '@/components/HelloWorld' @ ๋Š” src(root)๋ถ€ํ„ฐ ์‹œ์ž‘ํ•œ๋‹ค๋Š” ๋œป์ด๋ผ๊ณ  ํ•œ๋‹ค. 2021. 10. 22.
๊ฐ€๋น„์ง€ ์ปฌ๋ ‰ํ„ฐ(GC) Garbage = ์ •๋ฆฌ๋˜์ง€ ์•Š์€ ๋ฉ”๋ชจ๋ฆฌ, ์œ ํšจํ•˜์ง€ ์•Š์€ ๋ฉ”๋ชจ๋ฆฌ ์ฃผ์†Œ ๋ฉ”๋ชจ๋ฆฌ ๊ด€๋ฆฌ ๊ธฐ๋ฒ• ์ค‘์˜ ํ•˜๋‚˜. ํ”„๋กœ๊ทธ๋žจ์ด ๋™์ ์œผ๋กœ ํ• ๋‹นํ–ˆ๋˜ ๋ฉ”๋ชจ๋ฆฌ ์˜์—ญ ์ค‘์—์„œ ํ•„์š”์—†๊ฒŒ ๋œ ์˜์—ญ์„ ํ•ด์ œํ•˜๋Š” ๊ธฐ๋Šฅ์ž…๋‹ˆ๋‹ค. ๋Ÿฐํƒ€์ž„ ํ™˜๊ฒฝ์— ๋”ฐ๋ผ ํŠน์ • ์‹œ์ ์ด๋‚˜ ๋ฉ”๋ชจ๋ฆฌ ์‚ฌ์šฉ๋Ÿ‰์ด ํฌํ™” ์ƒํƒœ์— ์ž„๋ฐ•ํ•  ๋•Œ๋งˆ๋‹ค ์ž๋™์œผ๋กœ ์ˆ˜๊ฑฐ ๋Œ€์ƒ๋“ค์„ ์ˆ˜๊ฑฐํ•ฉ๋‹ˆ๋‹ค. ์ˆ˜๊ฑฐ๋œ ๋ฉ”๋ชจ๋ฆฌ๋Š” ๋‹ค์‹œ ์ƒˆ๋กœ์šด ๊ฐ’์„ ํ• ๋‹นํ•  ์ˆ˜ ์žˆ๋Š” ๋นˆ ๊ณต๊ฐ„์ด ๋ฉ๋‹ˆ๋‹ค. 2021. 10. 22.
Vue.js ๊ณต๋ถ€ 1์ผ์ฐจ Vue.js๋Š” ์›น ํ”„๋ก ํŠธ์—”๋“œ ํ”„๋ ˆ์ž„์›Œํฌ์ด๋‹ค. Vue.js๋Š” ์ปดํฌ๋„ŒํŠธ ๊ธฐ๋ฐ˜์˜ SPA๋ฅผ ๊ตฌ์ถ•ํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ•ด์ฃผ๋Š” ํ”„๋ ˆ์ž„์›Œํฌ์ด๋‹ค. 1. Visual Studio Code 2. Node.js 3. Vue.js ์„ค์น˜ $ npm install vue ์œ„์˜ ๋ช…๋ น์–ด๋กœ ์„ค์น˜ํ•˜๋ฉด vue@2.6.12 ๋ฒ„์ „์ด ์„ค์น˜๋œ๋‹ค๊ณ  ํ•œ๋‹ค. $ npm install -g @vue/cli CLI : Command Line Interface ์œ„์˜ ๋ช…๋ น์–ด๋กœ ์„ค์น˜ํ•˜๋ฉด @vue/cli 4.5.12 ๋ฒ„์ „์ด ์„ค์น˜๋œ๋‹ค๊ณ  ํ•œ๋‹ค. Vue.js์—์„œ ์ œ๊ณตํ•˜๋Š” Vue.js devtools๋กœ ํฌ๋กฌ์— ์ถ”๊ฐ€ํ•ด์„œ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค. ๋””๋ฒ„๊น…์„ ๊ฐ€๋Šฅํ•˜๋„๋ก ํ•ด์ค€๋‹ค. https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogj.. 2021. 10. 18.
[๋“œ๋ฆผ์ฝ”๋”ฉ by ์—˜๋ฆฌ] JavaScript ๊ธฐ์ดˆ ๊ฐ•์˜(2) (ES5+) 'use strict' ์‚ฌ์šฉ 'use strict'; Variable (๋ณ€์ˆ˜) - ๋ณ€๊ฒฝ๋  ์ˆ˜ ์žˆ๋Š” ๊ฐ’ - JavaScript์—์„œ๋Š” let ์œผ๋กœ ์‚ฌ์šฉํ•œ๋‹ค. (ES6์—์„œ ์ถ”๊ฐ€๋จ) ๐Ÿ”ฅ let ์ด์ „์—๋Š” var์„ ์‚ฌ์šฉํ–ˆ๋Š”๋ฐ var์˜ ์‚ฌ์šฉ์€ ์ง€์–‘ํ•œ๋‹ค! var์€ Block Scope๋„ ๋ฌด์‹œํ•œ๋‹ค. Block Scope { let name = 'yunkyung'; console.log(name); // yunkyung name = 'hello'; console.log(name); // hello } console.log(name); // ์ถœ๋ ฅ ์•ˆ๋จ ์ด๋ ‡๊ฒŒ block ์•ˆ์— ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•˜๊ฒŒ ๋˜๋ฉด block ๋ฐ–์—์„œ๋Š” ์•ˆ์˜ ๋‚ด์šฉ๋“ค์„ ๋ณผ ์ˆ˜ ์—†๋‹ค. Constants - ๊ฐ€๋ฆฌํ‚ค๊ณ  ์žˆ๋Š” ํฌ์ธํ„ฐ๊ฐ€ ์ž ๊ฒจ ์žˆ๋‹ค. - ์„ ์–ธ๊ณผ ๋™์‹œ์— ํ• ๋‹น์ด.. 2021. 10. 6.
[๋“œ๋ฆผ์ฝ”๋”ฉ by ์—˜๋ฆฌ] JavaScript ๊ธฐ์ดˆ ๊ฐ•์˜(1) (ES5+) - head + defer script ํƒœ๊ทธ๋ฅผ ์‚ฌ์šฉํ•  ๋•Œ defer ์†์„ฑ ์‚ฌ์šฉํ•˜๊ธฐ ์ด ๋ฐฉ๋ฒ•์ด ๊ฐ€์žฅ ์œ ์šฉํ•˜๋‹ค. - use strict ์ˆœ์ˆ˜ vanilla js๋ฅผ ์‚ฌ์šฉํ•˜๋ ค๋ฉด ์‹ค์ˆ˜ ๋ฐฉ์ง€๋ฅผ ์œ„ํ•ด use strict์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด ์ข‹๋‹ค. (TypeScript ์‚ฌ์šฉํ•  ๋• ์„ ์–ธํ•  ํ•„์š” ์—†์Œ) 'use strict' console.log('Hello world'); 2021. 10. 5.
[์ƒํ™œ์ฝ”๋”ฉ-React] State ์‚ฌ์šฉ [์ถœ์ฒ˜ : Youtube - ์ƒํ™œ์ฝ”๋”ฉ] https://youtu.be/e2c1EUcW7oo?list=PLuHgQVnccGMCRv6f8H9K5Xwsdyg4sFSdi ์˜ค๋Š˜ ๋ฐฐ์šฐ๋Š”๊ฑด ์ดํ•ดํ•˜๋ คํ•˜์ง€๋ง๊ณ  ๊ทธ๋ƒฅ ๊ทธ๋ ‡๊ตฌ๋‚˜ ํ•˜๊ณ  ๋ฐ›์•„๋“ค์ด๋Š”๊ฒŒ ํŽธํ•˜๋‹ค๊ณ  ํ•œ๋‹ค... โ€ป์ฃผ์˜ : ๋ฆฌ์•กํŠธ์—์„œ๋Š” props์— ๋”ฐ์˜ดํ‘œ๋ฅผ ์“ฐ๋ฉด ๋ฌธ์ž๋กœ ์ธ์‹์„ ํ•œ๋‹ค. ๋ฌธ์ž๊ฐ€ ์•„๋‹ˆ๋ผ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์˜ ์ฝ”๋“œ๋กœ์„œ ์‹คํ–‰ํ•˜๊ฒŒํ•˜๊ณ ์‹ถ์œผ๋ฉด ์ค‘๊ด„ํ˜ธ{}๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ๋œ๋‹ค. src/App.js import './App.css'; import TOC from "./components/TOC"; import Content from "./components/Content"; import Subject from "./components/Subject"; import React, { Com.. 2021. 5. 29.
๋ฐ˜์‘ํ˜•