[ํ•ญํ•ด99] Day01. TIL โ€“ ๋ฏธ๋‹ˆ ํ”„๋กœ์ ํŠธ ๊ธฐํš / Jinja2 ์‚ฌ์šฉ

2022. 2. 18. 00:45ยท ๊ฐœ๋ฐœ/โ›ต ํ•ญํ•ด99
๋ชฉ์ฐจ
  1. โญ 1์ฃผ์ฐจ ํ”„๋กœ์ ํŠธ : ์ „์‹œ ๋ญํ•˜๋‹ˆ? (์ „์‹œํšŒ ๋ฆฌ๋ทฐ ์‚ฌ์ดํŠธ)
  2. โญ ํŒŒ์ด์ฌ jinja2 ์‚ฌ์šฉ๋ฒ•
728x90
๋ฐ˜์‘ํ˜•

๋ณธ ํฌ์ŠคํŒ…์€ ์ง€๋‚œ 11์›”์— ์—…๋กœ๋“œ๋˜์—ˆ์Šต๋‹ˆ๋‹ค. 

 

 

โญ 1์ฃผ์ฐจ ํ”„๋กœ์ ํŠธ : ์ „์‹œ ๋ญํ•˜๋‹ˆ? (์ „์‹œํšŒ ๋ฆฌ๋ทฐ ์‚ฌ์ดํŠธ)

์™€์ด์–ดํ”„๋ ˆ์ž„ ์ž‘์„ฑ

โœ” 1์ฃผ์ฐจ ํŒ€์›๋“ค๊ณผ ํ•จ๊ป˜ ๊ณ ์•ˆ๋œ ์•„์ด๋””์–ด๋ฅผ ์ฒด๊ณ„ํ™”์‹œํ‚ค๋Š” ๊ฒƒ์œผ๋กœ ๋Œ€๋ถ€๋ถ„์˜ ์‹œ๊ฐ„์„ ๋ณด๋ƒˆ๋‹ค. ๋‚ด๊ฐ€ ์ƒ๊ฐ์ง€ ๋ชปํ•œ ์•„์ด๋””์–ด์™€ ๊ธฐ๋Šฅ๋ถ€๋ถ„๋“ค์„ ํ•จ๊ป˜ ์ƒ๊ฐํ•ด๋‚˜๊ฐ€๋‹ค๋ณด๋‹ˆ ์ด๋ฏธ ๊ทธ๋Ÿด์‹ธํ•œ ํ”„๋กœ์ ํŠธ๊ฐ€ ํƒ„์ƒํ•œ ๊ธฐ๋ถ„์„ ๋А๊ผˆ๋‹ค.

 

 

 

 

โญ ํŒŒ์ด์ฌ jinja2 ์‚ฌ์šฉ๋ฒ•

Jinja2 is a templating engine for Python.

 

jinja๋Š” python ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์–ธ์–ด์šฉ ์›น ํ…œํ”Œ๋ฆฟ ์—”์ง„์ด๋‹ค. Flask๋กœ ์›น์„œ๋ฒ„๋ฅผ ๊ตฌ์ถ•ํ•˜๊ณ , jinja2๋Š” ๊ทธ ์†์—์„œ ์‹ค์žฌํ•˜๋Š” ์–ด๋–ค ํŒŒ์ผ์— ์–ด๋–ค ๋ณ€์ˆ˜๋ฅผ ์ง‘์–ด๋„ฃ์–ด์„œ ์•ฝ๊ฐ„ ๋ณ€๊ฒฝ์‹œ์ผœ์„œ html๋กœ ๋งŒ๋“ค์–ด์ฃผ๋Š” ์—”์ง„์ด๋ผ๊ณ  ๋ณผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ajax๋ฅผ ํ†ตํ•ด์„œ ๋ฐ์ดํ„ฐ๋ฅผ ๋ฐ›์•„์˜ค๋˜ ๊ฒƒ์„ jinja2๋ฅผ ์ข€๋” ๊ฐ„๋‹จํ•˜๊ฒŒ ๋งŒ๋“ค ์ˆ˜ ์žˆ๋‹ค.

statement ๋Š” {% %} ์œผ๋กœ

for ๋ฌธ์€ {% for โ€“ in โ€“ %} {% endfor %}

if ๋ฌธ์€ {% if โ€“ %} {% endif %}

ํŠน์ดํ•œ ์ ์ด ์žˆ๋‹ค๋ฉด ๋๋งˆ์น˜๋Š” ๋ถ€๋ถ„์— end๋ฅผ ์จ์ค˜์•ผํ•œ๋‹ค๋Š” ๊ฒƒ์ด๊ณ , ๋“ค์—ฌ์“ฐ๊ธฐ๊ฐ€ ์ž˜๋˜์–ด์•ผ์ง€ ์˜ค๋ฅ˜์—†์ด ์ž˜ ์ž‘๋™๋œ๋‹ค.

๋ณ€์ˆ˜๋Š” {{ }} ์ด๋Ÿฐ์‹์œผ๋กœ ๋Œ€๊ด„ํ˜ธ๊ฐ€ ๋‘๋ฒˆ์”ฉ ๋“ค์–ด๊ฐ„๋‹ค.

โœ”๊ฒฐ๊ณผ์ ์œผ๋กœ ํ…œํ”Œ๋ฆฟ์„ jinja ๋ฌธ๋ฒ•์— ๋”ฐ๋ผ์„œ ๋งŒ๋“ค๊ณ , flask๋ฅผ ํ†ตํ•ด์„œ ๋ Œ๋”๋งํ•ด์ฃผ๋ฉด ajax๋ฅผ ์“ฐ์ง€ ์•Š๊ณ ๋„ ๊ฐ„๊ฒฐํ•˜๊ณ  ๊ฐ„๋‹จํ•œ๊ฒŒ ๋ฐ์ดํ„ฐ๋ฅผ ๋ถˆ๋Ÿฌ์˜ฌ ์ˆ˜ ์žˆ๋‹ค. python์— ์•„์ง ์ต์ˆ™ํ•˜์ง€ ์•Š์€๋ฐ, python ํ…œํ”Œ๋ฆฟ์„ ํ†ตํ•ด์„œ ์›น๋ถ€๋ถ„๋„ ๋งŒ๋“ค์ˆ˜ ์žˆ๊ฒŒ๋˜์—ˆ๋‹ค๋Š”๊ฑด ํฅ๋ฏธ๋กœ์šด ๊ฒƒ ๊ฐ™๋‹ค.

 

๐Ÿ‘‰๐Ÿป jinja ๊ณต์‹ํŽ˜์ด์ง€

 

Jinja โ€” Jinja Documentation (2.11.x)

 

jinja.palletsprojects.com

 

 

 

๐Ÿ’œ ํšŒ๊ณ 

jinja2 ์‚ฌ์šฉ๋ฒ•์„ ์ตํžˆ์‹œ ์œ„ํ•œ ๊ฐ•์˜์™€ ๊ฐ•์˜์ž๋ฃŒ๋ฅผ ๋ณด๋Š”๋ฐ, ๋‚ด๊ฐ€ ์“ฐ๋Š” pyCharm setting์—์„œ ๋ณด์ง€ ๋ชปํ•˜๋Š” ๋ฉ”๋‰ด๋“ค์ด ๋„ˆ๋ฌด ๋งŽ์€ ๊ฒƒ์ด๋‹ค. ์ˆœ๊ฐ„ ๋„ˆ๋ฌด ๋‹นํ™ฉํ•ด์„œ ๊ตฌ๊ธ€๋ง์„ ์—„์ฒญํ•˜๊ณ  ์ด์œ ๋ฅผ ๋ชฐ๋ผ์„œ ์–ด์ฉŒ์ง€~ํ–ˆ๋Š”๋ฐ, pyCharm ๋ฒ„์ ผ์ด ๋‹ฌ๋ผ์„œ ๊ทธ๋Ÿฐ๊ฑฐ์˜€๋‹ค.

์‚ฌ์ „๊ต์œก์„ ํ•˜๋ฉด์„œ ์‚ฌ์šฉํ–ˆ๋˜ ๋ฒ„์ ผ์€ community ๋ฒ„์ ผ์ด์˜€๊ณ , jinja2๋ฅผ ์œ„ํ•ด์„œ๋Š” pro๋ฒ„์ ผ์„ ์จ์•ผํ–ˆ๋‹ค. ์ด ์ด์œ ๋ฅผ ์ฐพ๋Š”๋‹ค๊ณ  ์‹œ๊ฐ„์„ ๋‚ญ๋น„ํ–ˆ๋‹ค๋‹ˆ ใ… 

 

 

 

 

 

 

728x90

'๊ฐœ๋ฐœ > โ›ต ํ•ญํ•ด99' ์นดํ…Œ๊ณ ๋ฆฌ์˜ ๋‹ค๋ฅธ ๊ธ€

[ํ•ญํ•ด99] Day08. TIL โ€“ 2์ฃผ์ฐจ ์•Œ๊ณ ๋ฆฌ์ฆ˜ ๊ณต๋ถ€ ์‹œ์ž‘!  (0) 2022.02.18
[ํ•ญํ•ด99] Week01. WIL ํœ˜๋ชฐ์•„์ณค๋˜ ํ”„๋กœ์ ํŠธ ๋งˆ๋ฌด๋ฆฌ / ํ”ผ๋“œ๋ฐฑ  (0) 2022.02.18
[ํ•ญํ•ด99] Day03. TIL โ€“ Key๊ฐ’์„ ์ฐพ์•„๋ผ! Github์„ ๋‹ค๋ฃฐ ์ค„ ์•Œ์•„์•ผ ์ง„์งœ ํ˜‘์—…์ด ์‹œ์ž‘๋œ๋‹ค!  (0) 2022.02.18
[ํ•ญํ•ด99] Day02. TIL โ€“ DB๋กœ ๋ฐ์ดํ„ฐ ๋ณด๋‚ด๊ธฐ / ๋ฐ์ดํ„ฐ ๋ถˆ๋Ÿฌ์˜ค๊ธฐ / ๊ฒ€์ƒ‰ ๊ธฐ๋Šฅ ์ถ”๊ฐ€  (0) 2022.02.18
[ํ•ญํ•ด99/4๊ธฐ] 00. WIL (์‚ฌ์ „์ค€๋น„)  (0) 2022.02.18
  1. โญ 1์ฃผ์ฐจ ํ”„๋กœ์ ํŠธ : ์ „์‹œ ๋ญํ•˜๋‹ˆ? (์ „์‹œํšŒ ๋ฆฌ๋ทฐ ์‚ฌ์ดํŠธ)
  2. โญ ํŒŒ์ด์ฌ jinja2 ์‚ฌ์šฉ๋ฒ•
'๊ฐœ๋ฐœ/โ›ต ํ•ญํ•ด99' ์นดํ…Œ๊ณ ๋ฆฌ์˜ ๋‹ค๋ฅธ ๊ธ€
  • [ํ•ญํ•ด99] Week01. WIL ํœ˜๋ชฐ์•„์ณค๋˜ ํ”„๋กœ์ ํŠธ ๋งˆ๋ฌด๋ฆฌ / ํ”ผ๋“œ๋ฐฑ
  • [ํ•ญํ•ด99] Day03. TIL โ€“ Key๊ฐ’์„ ์ฐพ์•„๋ผ! Github์„ ๋‹ค๋ฃฐ ์ค„ ์•Œ์•„์•ผ ์ง„์งœ ํ˜‘์—…์ด ์‹œ์ž‘๋œ๋‹ค!
  • [ํ•ญํ•ด99] Day02. TIL โ€“ DB๋กœ ๋ฐ์ดํ„ฐ ๋ณด๋‚ด๊ธฐ / ๋ฐ์ดํ„ฐ ๋ถˆ๋Ÿฌ์˜ค๊ธฐ / ๊ฒ€์ƒ‰ ๊ธฐ๋Šฅ ์ถ”๊ฐ€
  • [ํ•ญํ•ด99/4๊ธฐ] 00. WIL (์‚ฌ์ „์ค€๋น„)
๋ฐ(Ming) ๐Ÿˆโ€โฌ›
๋ฐ(Ming) ๐Ÿˆโ€โฌ›
๐Ÿ‘ฉ๐Ÿปโ€๐Ÿ’ป Frontend Developer
๋ฐ(Ming) ๐Ÿˆโ€โฌ›
Ming devlog
๋ฐ(Ming) ๐Ÿˆโ€โฌ›
์ „์ฒด
์˜ค๋Š˜
์–ด์ œ

๊ณต์ง€์‚ฌํ•ญ

  • About Ming ๐Ÿฐ
  • ๋ถ„๋ฅ˜ ์ „์ฒด๋ณด๊ธฐ (261)
    • ๊ฐœ๋ฐœ (255)
      • ๐Ÿ“ TIL (58)
      • โŒ ์˜ค๋ฅ˜ ๋…ธํŠธ (23)
      • React (23)
      • Next.js (11)
      • React-Native (6)
      • JavaScript (10)
      • Flutter (19)
      • Database (1)
      • ๐Ÿ’ฌ ์ฝ”๋”ฉํ…Œ์ŠคํŠธ (21)
      • ๐Ÿ“š English (9)
      • Etc... (25)
      • โ›ต ํ•ญํ•ด99 (49)
    • ๐Ÿ’ป Dev (6)
      • ๐Ÿ“ TIL (4)
      • ๐Ÿ’ฌ Algorithm (1)
      • Etc... (1)

์ธ๊ธฐ ๊ธ€

ํƒœ๊ทธ

  • react
  • ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ
  • ReactNative
  • ์•Œ๊ณ ๋ฆฌ์ฆ˜
  • react-native
  • ์ฝ”๋”ฉํ…Œ์ŠคํŠธ
  • ์ด์ฝ”๋…ธ๋ฏธ์ŠคํŠธ
  • ์ฝ”ํ…Œ๊ณต๋ถ€
  • ์˜์–ด๊ณต๋ถ€
  • TIL
  • nextjs
  • ํ”„๋กœ๊ทธ๋ž˜๋จธ์Šค
  • twid
  • ๋ฆฌ์•กํŠธ
  • Firebase
  • ํ”Œ๋Ÿฌํ„ฐ
  • github
  • ๋ถ€ํŠธ์บ ํ”„
  • ํ•ญํ•ด99
  • ๋ฆฌ์•กํŠธ๋„ค์ดํ‹ฐ๋ธŒ
  • ๊ฐœ๋ฐœ์ž์ผ๊ธฐ
  • ์ŠคํŒŒ๋ฅดํƒ€์ฝ”๋”ฉํด๋Ÿฝ
  • ์ฝ”ํ…Œ
  • todaywhatidid
  • ์ฝ”๋”ฉ๊ณต๋ถ€
  • ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ
  • flutter
  • ๊ฐœ๋ฐœ์žํšŒ๊ณ 
  • Git
  • leetcode

์ตœ๊ทผ ๋Œ“๊ธ€

์ตœ๊ทผ ๊ธ€

250x250
hELLO ยท Designed By ์ •์ƒ์šฐ.v4.2.1
๋ฐ(Ming) ๐Ÿˆโ€โฌ›
[ํ•ญํ•ด99] Day01. TIL โ€“ ๋ฏธ๋‹ˆ ํ”„๋กœ์ ํŠธ ๊ธฐํš / Jinja2 ์‚ฌ์šฉ
์ƒ๋‹จ์œผ๋กœ

ํ‹ฐ์Šคํ† ๋ฆฌํˆด๋ฐ”

๊ฐœ์ธ์ •๋ณด

  • ํ‹ฐ์Šคํ† ๋ฆฌ ํ™ˆ
  • ํฌ๋Ÿผ
  • ๋กœ๊ทธ์ธ

๋‹จ์ถ•ํ‚ค

๋‚ด ๋ธ”๋กœ๊ทธ

๋‚ด ๋ธ”๋กœ๊ทธ - ๊ด€๋ฆฌ์ž ํ™ˆ ์ „ํ™˜
Q
Q
์ƒˆ ๊ธ€ ์“ฐ๊ธฐ
W
W

๋ธ”๋กœ๊ทธ ๊ฒŒ์‹œ๊ธ€

๊ธ€ ์ˆ˜์ • (๊ถŒํ•œ ์žˆ๋Š” ๊ฒฝ์šฐ)
E
E
๋Œ“๊ธ€ ์˜์—ญ์œผ๋กœ ์ด๋™
C
C

๋ชจ๋“  ์˜์—ญ

์ด ํŽ˜์ด์ง€์˜ URL ๋ณต์‚ฌ
S
S
๋งจ ์œ„๋กœ ์ด๋™
T
T
ํ‹ฐ์Šคํ† ๋ฆฌ ํ™ˆ ์ด๋™
H
H
๋‹จ์ถ•ํ‚ค ์•ˆ๋‚ด
Shift + /
โ‡ง + /

* ๋‹จ์ถ•ํ‚ค๋Š” ํ•œ๊ธ€/์˜๋ฌธ ๋Œ€์†Œ๋ฌธ์ž๋กœ ์ด์šฉ ๊ฐ€๋Šฅํ•˜๋ฉฐ, ํ‹ฐ์Šคํ† ๋ฆฌ ๊ธฐ๋ณธ ๋„๋ฉ”์ธ์—์„œ๋งŒ ๋™์ž‘ํ•ฉ๋‹ˆ๋‹ค.