FE-8์ฃผ์ฐจ (0525)

์„ ๋ฏผยท2023๋…„ 6์›” 1์ผ

FrontEnd_TIL

๋ชฉ๋ก ๋ณด๊ธฐ
5/8

๐Ÿ“‚ ์ฐฝ์—…??

โœ… Done is better than perfect
managing์ด ์ค‘์š” ๐Ÿ˜€
์ฐฝ์—… โžก๏ธ ๋ฒ•์ธ+ํŒ€+๋งค์ถœ
์ž…์‚ฌ ํ›„ 3๋…„ ์ฐจ์— ๊นจ๋‹ฌ์Œ..
์ฐฝ์—…ํ•˜๋ฉด ๋งํ•˜๋”๋ผ๋„ ์ง‘์•ˆ ๋ง์•„๋จน๋Š” ์‚ฌ๋žŒ์€ ๊ฑฐ์˜ ์—†์Œ
-> ์ฐฝ์—… ์‹œ๋„ ๋‚˜์˜์ง€ ์•Š๋‹คโ—๏ธ


๐Ÿ“‚ ๊ฐ€์ƒํ™˜๊ฒฝ ๋งŒ๋“ค๊ธฐ

  • ๊ฐ€์ƒํ™˜๊ฒฝ: ์ž‘์—…์„ ๋ฐ”๊ฟ€ ๋•Œ๋งˆ๋‹ค ๋‹ค๋ฅธ ๋ฒ„์ „์˜ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์„ค์น˜ํ•ด์•ผ ํ•˜๋Š” ๋ถˆํŽธํ•จ์„ ํ•ด์†Œ์‹œํ‚ค๊ธฐ ์œ„ํ•œ ๋ฐฉ๋ฒ•
python -m venv venv_mapping_django
pip install django

๐Ÿ“ ํ”„๋ก ํŠธ๋Š” appํŒŒ์ผ๋งŒ ์‹ ๊ฒฝ์“ฐ๊น…
๐Ÿ“ template ์•ˆ์— appํด๋” ๋งŒ๋“ค๊ธฐ

python manage.py startapp mapping_django_app
templates>mapping_django_app // ํด๋” ์ƒ์„ฑ
static>images, css, js // ํด๋” 3๊ฐœ ์ƒ์„ฑ

๐Ÿ“ ์žฅ๊ณ  { % load static % } = ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ import
โžก๏ธ load ์—ญํ•  = static ํด๋”๋ฅผ ๋“ค๊ณ ์˜ค๋Š” ๊ฒƒ, ๋ชจ๋“  html ํŒŒ์ผ ์œ„์— ์ž…๋ ฅํ•˜๊ธฐ

<body>
    <h1> json ๋ฐ์ดํ„ฐ ๋ฐ›๊ธฐ </h1>
    <script>
        let data = '{{ json_data }}';
        console.log(data);
        document.write(data);
    </script>
</body>

๐Ÿ“ ๊ฒฝ๋กœ ๊ฑธ์–ด์ค„ ๋•Œ๋„ ๋ชจ๋‘ {% %} ์•ˆ์— ๋„ฃ๊ธฐ

  • JSON ๋ฐ์ดํ„ฐโญ๏ธ
    ์ด๋ฆ„๊ณผ ๊ฐ’์˜ ์Œ = key : value ํ˜•์‹์œผ๋กœ ๊ตฌ์„ฑ, ์ค‘๊ด„ํ˜ธ({})๋กœ ๋‘˜๋Ÿฌ์Œ“์•„ ํ‘œํ˜„, ๊ฐ์ฒด ๋ฉ”์†Œ๋“œ๋ž‘ ๋น„์Šทํ•œ ํ˜•ํƒœ์ง€๋งŒ ๊ฐœ๋… ๋‹ค๋ฆ„
    JSON ๋ฐ์ดํ„ฐ๋Š” ์‰ผํ‘œ(,)๋กœ ๋‚˜์—ด

profile
์•ˆ๋…•ํ•˜์„ธ์š”๊ฏ

0๊ฐœ์˜ ๋Œ“๊ธ€