ํ ๋ฒ์ ๋๋ด๋ ์๋ฐ์คํฌ๋ฆฝํธ: ๋ฐ๋๋ผ ์๋ฐ์คํฌ๋ฆฝํธ๋ก SPA ๊ฐ๋ฐ๊น์ง
๊ธฐ๋ณธ ๋ฌธ๋ฒ๋ถํฐ ์ฌํ ๊ฐ๋ ๊น์ง ํ์ตํ๋ฉด์, ๋ฐ๋๋ผ ์๋ฐ์คํฌ๋ฆฝํธ๋ก SPA๋ฅผ ๊ฐ๋ฐํด ๋ด ์๋ค๐ฅ
์๊ฐ์ 8,407๋ช
๋์ด๋ ์ด๊ธ
์๊ฐ๊ธฐํ ๋ฌด์ ํ

๋ค๋ฅธ ์๊ฐ์๋ค์ด ์์ฃผ ๋ฌผ์ด๋ณด๋ ์ง๋ฌธ์ด ๊ถ๊ธํ์ ๊ฐ์?
- ํด๊ฒฐ
์ฝ๋ฐฑ ํจ์ ๋ฉ์๋ ๋ฑ๋ก
export default function CityList({ $app, intialState, handleLoadMore }) { this.state = intialState;
javascriptrest-apispadom์ฝ๋ฉ
ใป
ํ ๋ฌ ์
0
42
2
- ํด๊ฒฐ
ssr๋ฐฉ์ ๊ฒฝํ
์ทจ์ ์ค๋น๋ฅผ ์ํดreact, next ๊ฐ์๋ฅผ ๋ฃ๊ธฐ์ ์ ํ๋ ์์ํฌ์ ๋ํ ๊น์ ์ดํด๋ฅผ ์ํด๋ฐ๋๋ผjs๋ก spa + csr๋ฐฉ์์ ์ฒด๋ํ๊ธฐ ์ํด ์ด ๊ฐ์๋ฅผ ๋ฃ๊ณ
javascriptrest-apispadom์ฝ๋ฉ
ใป
ํ ๋ฌ ์
0
50
1
- ํด๊ฒฐ
compare ํจ์ ์ค๋ช ์ ์คํด์ ์์ง๊ฐ ์์ด๋ณด์ ๋๋ค.
์๋ ํ์ธ์. ์๋ ํผ๋์ ์ค์ ์๋ ์ค๋ช ์ ๋ํด ๋ฌธ์๋๋ฆฝ๋๋ค. ์๋ ์บก์ถฐ ์ค๋ช ์์ a: ๋ค์<p style="text-align: l
javascriptrest-apispadom์ฌ๋2
ใป
2๋ฌ ์
0
60
2
- ํด๊ฒฐ
API๋ฅผ ๋น๋๊ธฐ ์ฒ๋ฆฌํ๋ ์ด์ ๊ฐ ๋๊ฒจ์ ๊ทธ๋ฐ๊ฑด๊ฐ์?
API๋ฅผ ๋น๋๊ธฐ ์ฒ๋ฆฌํ๋ ์ด์ ๊ฐ HTTP๋ฅผ ์จ์ ๊ทธ๋ฐ๊ฐ์?๊ฐ์ ๋ด์์ ์ฌ์ฉํ๋ API๊ฐ REST API์ด๊ณ , REST API๋ HTTP๋ฅผ ์ฐ๋์?&n
javascriptrest-apiSec
ใป
2๋ฌ ์
0
70
2
- ํด๊ฒฐ
DOM ํธ๋ฆฌ ๋ณด๋ ๊ณณ
<img src="https://cdn.inflearn.com/public/files/posts/f6ea91dd-95a4-4680-af5d-12dd4568022b/02144162-5eb3-4414-a628-0a4bd84bab23.png" media-type="img"
javascriptdomSec
ใป
3๋ฌ ์
0
63
1
- ํด๊ฒฐ
๋ฐฐ์ด๊ณผ ๊ฐ์ฒด์ ๊ตฌ์กฐ๋ถํดํ ๋น ๋ฐฉ๋ฒ์ด ๋ค๋ฅธ ์ด์
// ๋ฐฐ์ด ๊ตฌ์กฐ๋ถํดํ ๋น const arr = ['a', 'b', 'c']; const [first, second] = arr;<code class="language-j
javascriptSec
ใป
3๋ฌ ์
0
63
2
- ํด๊ฒฐ
๋ฐฐ์ด ๋ฉ์๋๊ฐ ์์ ํจ์์ธ์ง ํ์ธํ๋ ๋ฐฉ๋ฒ
MDN์ ๋ฐฐ์ด์ ๋ฉ์๋๋ค์ด ๋ง๋๋ฐ, ์ฌ์ด๋ ์ดํํธ๊ฐ ์๋ ์์ ํจ์์ธ์ง ํ์ธํ๋ ๋ฐฉ๋ฒ ์๋์?์ผ์ผ์ด ํด๋น ๋ฉ์๋๋ค์ ์ฌ๋ฌ ๊ฐ์ ์ ๋ ฅํ๋ ๋ฐฉ๋ฒ ๋ฐ์ ์๋์? </p
javascriptSec
ใป
3๋ฌ ์
0
51
2
- ํด๊ฒฐ
์ฝ๋ฐฑ ํจ์์ ๋งค๊ฐ๋ณ์๋ก _๋ฅผ ์ฐ๋ ์ด์ ๊ฐ ๋ฌด์์ธ๊ฐ์?
// forEach let arr = [1, 2, 3, 4, 5]; // forEach ์ฝ๋ฐฑ ํจ์ arr.forEach((_, _
javascriptSec
ใป
3๋ฌ ์
0
58
2
- ํด๊ฒฐ
์ฝ๋ฐฑ ํจ์์ ๋งค๊ฐ๋ณ์๋ ์ด๋ป๊ฒ ๊ตฌ๋ถ๋๋์?
// forEach let arr = [1, 2, 3, 4, 5]; // forEach ์ฝ๋ฐฑ ํจ์ arr.forEach((elm, idx, array) => { // ์ฝ๋ฐฑ ํจ์์ ๋งค๊ฐ๋ณ์
javascriptSec
ใป
3๋ฌ ์
0
46
1
- ํด๊ฒฐ
ํธ์ด์คํ ์์ฐ๋๊ฒ ์ข๋์?
ํธ์ด์คํ ์ ์ฌ๋งํ๋ฉด ์์ฐ๋๊ฒ ์ข๋์?ESLint๋ก ํธ์ด์คํ ๋ง๋ ๊ฒฝ์ฐ๋ ์๊ณ , ํธ์ด์คํ ์ด ์ํฐ ํจํด์ด๋ผ๋ ๊ฒฝ์ฐ๋ ์๋ค์.<p style="text-alig
javascriptSec
ใป
3๋ฌ ์
0
41
2
- ํด๊ฒฐ
ํจ์ ์ ์ธ์๊ณผ ํจ์ ํํ์์ ์ด๋ค ๊ฒฝ์ฐ์ ์ฐ๋ฉด ์ข๋์?
// ํจ์ ์ ์ธ์ function func() { console.log('hello javascript'); } // ํจ์ ํํ์ - function ํจ์ const func = functi
javascriptSec
ใป
3๋ฌ ์
0
60
2
- ํด๊ฒฐ
?. ์ฐ์ฐ์๋ ์๋ฐ์คํฌ๋ฆฝํธ ์ฐ์ฐ์์ธ๊ฐ์?
const user = { name: "๊น๋ชจ์จ", address: { city: "์์ธ" } }; // ์ผ๋ฐ ์ ๊ทผ (์๋ฌ ์ํ) console.log(user.address.cit
javascripttypescriptSec
ใป
3๋ฌ ์
0
35
1
- ํด๊ฒฐ
JS์ ๋ ผ๋ฆฌ ์ฐ์ฐ์ &&, ||๊ฐ ๋ฆฌ์กํธ์ ์กฐ๊ฑด๋ถ ๋ ๋๋ง &&, ||์ธ๊ฐ์?
// && ์ฌ์ฉ - "๋ก๊ทธ์ธํ์ผ๋ฉด ๋ณด์ฌ์ค" {isLoggedIn && } // || ์ฌ์ฉ - "๋ก๊ทธ์ธ ์ํ์ผ๋ฉด ๋ณด์ฌ์ค" {!isLogged
javascriptreactSec
ใป
3๋ฌ ์
0
63
2
- ํด๊ฒฐ
์๋ฐ์คํฌ๋ฆฝํธ ์ง๋ฌธ
์ ์๋ ์ด ๊ฐ์๋ก ์์ค ์ ๋ฌธํ๋ ค๊ณ ํ๋๋ฐ์๋ฐ๋๋ผ ์๋ฐ์คํฌ๋ฆฝํธ๋ ๊ทธ๋ฅ ์๋ฐ์คํฌ๋ฆฝํธ๋ ๋๊ฐ์ ๊ฑด๊ฐ์?๋ค๋ฅด๋ค๋ฉด
javascriptrest-apispadom๊น์ฑ๊ด
ใป
4๋ฌ ์
1
89
2
- ํด๊ฒฐ
์์ ํธ์ง ๊ด๋ จ ๋ฌธ์
ํน์ 5:50 ์ด ์ฏค ์ธ์ฌ ํ ๋ค ์์์ ํธ์ง์ด ๋ ๋๊ฑธ๊น์?
์ฐ์
ใป
4๋ฌ ์
0
46
1
- ํด๊ฒฐ
๋๋ฌผ์จ๋ฒ๋ง๋ค๊ธฐ 1-1 api ์ค๋ฅ
const API_URL = "https://animal-api-two.vercel.app/"; const getData = async () => { let res = await fetch(API_URL); try { if (r
javascriptrest-apispadom๊น์์
ใป
4๋ฌ ์
0
44
2
- ํด๊ฒฐ
500 error ๋ฐ์
https://trip-wiki-a
์ฐ์
ใป
4๋ฌ ์
0
44
1
- ํด๊ฒฐ
ํฌํธ ๊ตฌ๋ถ ๊ด๋ จ
ํด๋ผ์ด์ธํธ๋ฅผ ์คํํ๋ ํฌํธ์ node๋ฅผ ์คํํ๋๋ก ํ๋ ํฌํธ๋ฅผ ๋ค๋ฅด๊ฒ ์ค์ ํ๋ ์ด์ ๊ฐ ์์๊น์?๊ฐ์๋ฅผ ๋ณด๋ฉด 5500๊ณผ 3000์ผ๋ก ๋ค๋ฅด๊ฒ ์ฌ์ฉํ๊ณ ์์ด์ loca
์ฐ์
ใป
5๋ฌ ์
0
47
2
- ํด๊ฒฐ
CityList๊ฐ๋ฐ-handleLoadMoreํจ์์ง๋ฌธ
์ฝ๋ ๊ด๋ จ ์ง๋ฌธ์ ์๋์ ๊ฐ์ด '์ฝ๋๋ธ๋ญ' ๊ธฐ๋ฅ์ ์ด์ฉํด์ฃผ์ธ์!+ ์ค๋ฅ ๋ฉ์ธ์ง๋ ํจ๊ป ์ฌ๋ ค์ฃผ์๋ฉด ์ข์์ ๐
javascriptrest-apispadom๊น๊ทํ
ใป
5๋ฌ ์
0
62
1
- ํด๊ฒฐ
๊ฐ์ฒด์ ๋ฐฐ์ด์ const ์ฐจ์ด
const๋ก ํ์ ๋ ๊ฐ์ฒด๋ ์์ ์ด ๋๊ณ ๋ฐฐ์ด์ ์์ ์ด ์๋๋ค๋ ์ค๋ช ๋ถ๋ถ์ด ์ดํด๊ฐ ์ ์๋ฉ๋๋ค. ๊ณ ์ ID๊ฐ ์๋๋ผ๋ ๋ง๋ ์ดํด๊ฐ ์ ์๋๋๋ฐ ๋ณด์ถฉ ์ค๋ช ์ ๋ฐ์ ์ ์์๊น์?
javascriptrest-apispadom์ด์ ์ฌ
ใป
5๋ฌ ์
0
36
1






