๋ฐ˜์‘ํ˜•

dev_mimgong 13

[โšก] ์ˆ˜์ œ๋น„ ์นดํŽ˜ Daily ๋ฌธ์ œ ํ’€์ด (2022๋…„ 1ํšŒ ์˜ˆ์ƒ๋ฌธ์ œ)

์ˆ˜์ œ๋น„- IT ์ปค๋ฎค๋‹ˆํ‹ฐ (์ •๋ณด์ฒ˜๋ฆฌ๊ธฐ์‚ฌ... : ๋„ค์ด๋ฒ„ ์นดํŽ˜ ์ˆ˜์ œ๋น„-์ˆ˜ํ—˜์ƒ ์ž…์žฅ์—์„œ ์ œ๋Œ€๋กœ ์“ด ๋น„๋ฒ•์„œ(์ •๋ณด์ฒ˜๋ฆฌ๊ธฐ์‚ฌ, ์ •๋ณด์ฒ˜๋ฆฌ๊ธฐ๋Šฅ์‚ฌ, ๋น…๋ฐ์ดํ„ฐ ๋ถ„์„๊ธฐ์‚ฌ ๋“ฑ ์‹œ๋ฆฌ์ฆˆ) cafe.naver.com 1๊ณผ๋ชฉ 1. ์ƒํ–ฅ์‹ ๋น„์šฉ ์‚ฐ์ • ๊ธฐ๋ฒ• ์ค‘ ์†Œํ”„ํŠธ์›จ์–ด ๊ฐ ๊ธฐ๋Šฅ์˜ ์›์‹œ ์ฝ”๋“œ ๋ผ์ธ ์ˆ˜์˜ ๋‚™๊ด€์น˜, ์ค‘๊ฐ„์น˜, ๋น„๊ด€์น˜๋ฅผ ์ธก์ •ํ•˜์—ฌ ์˜ˆ์ธก์น˜๋ฅผ ๊ตฌํ•˜๊ณ  ์ด๋ฅผ ์ด์šฉํ•˜์—ฌ ๋น„์šฉ์„ ์‚ฐ์ •ํ•˜๋Š” ๊ธฐ๋ฒ• โœ… LOC (Lines of Code) *๏ธโƒฃ ์ƒํ–ฅ์‹ ๋น„์šฉ ์„ ์ • ๋ฐฉ๋ฒ• : LoC, MM, COCOMO, Putnam, FP(Function Point) 2. ๊ด€๊ณ„์˜ ์œ ํ˜• โœ… (1) : ์ง‘ํ•ฉ ๊ด€๊ณ„ / (2) ์‹ค์ฒดํ™” ๊ด€๊ณ„ *๏ธโƒฃ UML์˜ ๊ด€๊ณ„ ์—ฐ๊ด€๊ด€๊ณ„ : ์‹ค์„  ํ™”์‚ดํ‘œ ์ง‘ํ•ฉ๊ด€๊ณ„ : ๋นˆ ๋งˆ๋ฆ„๋ชจ, ํ•˜๋‚˜์˜ ์‚ฌ๋ฌผ์ด ๋‹ค๋ฅธ ์‚ฌ๋ฌผ์— ํฌํ•จ ํฌํ•จ๊ด€๊ณ„ : ์†์ด ์ฑ„์›Œ์ง„ ๋งˆ๋ฆ„๋ชจ,..

[๋‚˜๋งŒ์˜ ๋‹จ์–ด์žฅ] 13. ์™„์„ฑ ์ฝ”๋“œ

โœ… ์ตœ์ข… ์ฝ”๋“œ ๊นƒํ—ˆ๋ธŒ https://github.com/mingyeong1203/Vocabulary-Notebook GitHub - mingyeong1203/Vocabulary-Notebook: Sparta Coding Club Boot Camp - Web Plus - Vocabulary Notebook Sparta Coding Club Boot Camp - Web Plus - Vocabulary Notebook - GitHub - mingyeong1203/Vocabulary-Notebook: Sparta Coding Club Boot Camp - Web Plus - Vocabulary Notebook github.com โœ… ํ•™์Šต ๋‚ด์šฉ ์ •๋ฆฌ ๋…ธ์…˜ (๋ธ”๋กœ๊ทธ ๋‚ด์šฉ์ด๋ž‘ ๋™์ผ) https://fair-cheet..

[๋‚˜๋งŒ์˜ ๋‹จ์–ด์žฅ] 12. ์ˆ™์ œ - ์˜ˆ๋ฌธ ์ €์žฅ & ์‚ญ์ œ ๊ธฐ๋Šฅ ๋งŒ๋“ค๊ธฐ

“status_give = old” ์ผ ๋•Œ๋งŒ ์˜ˆ๋ฌธ ์ž‘์„ฑ ์นธ ๋„์šฐ๊ธฐ input ๋ฐ•์Šค์— ์ž…๋ ฅ๋œ ์˜ˆ๋ฌธ์ด ํ•ด๋‹น ๋‹จ์–ด๋ฅผ ํฌํ•จํ•˜๊ณ  ์žˆ๋Š”์ง€ ํ™•์ธ ์žˆ์œผ๋ฉด DB์˜ examples ์ปฌ๋ ‰์…˜์— ์˜ˆ๋ฌธ ์ €์žฅ. ์˜ˆ๋ฌธ๋“ค ์ค‘์—์„œ ํ•ด๋‹น ๋‹จ์–ด์— ๊ด€ํ•œ ๊ฒƒ๋งŒ ์ฐพ์•„์™€์„œ ๋ณด์—ฌ์ฃผ๋Š” ํ•จ์ˆ˜๋ฅผ ๋งŒ๋“ค์–ด ํŽ˜์ด์ง€ ๋กœ๋”ฉ ์‹œ, ์ƒˆ ์˜ˆ๋ฌธ ์ €์žฅ ์‹œ, ๊ธฐ์กด ์˜ˆ๋ฌธ ์‚ญ์ œ ์‹œ ํ•จ์ˆ˜ ์‹คํ–‰. ์˜ˆ๋ฌธ ์‚ญ์ œ ์‹œ ์—ฌ๋Ÿฌ ์˜ˆ๋ฌธ ์ค‘ ์–ด๋–ค ๊ฒƒ์ธ์ง€ ๊ตฌ๋ถ„์„ ํ•˜๊ธฐ ์œ„ํ•ด ๊ฐ ์ค„์— id ๋ถ€์—ฌ ๋‹จ์–ด ์‚ญ์ œ ์‹œ ํ•ด๋‹น ์˜ˆ๋ฌธ๋“ค๋„ ๊ฐ™์ด ์ง€์›Œ์คŒ. {% if status=="old" %} // Write your own sentences! This sentence contains the word 'word'. delete I don't like using the MS Word program. delete add..

[๋‚˜๋งŒ์˜ ๋‹จ์–ด์žฅ] 11. ์™„์„ฑ๋„ ๋†’์ด๊ธฐ - ogํƒœ๊ทธ, favicon

โœ… og ํƒœ๊ทธ Open Graph ํƒœ๊ทธ๋กœ ์›นํŽ˜์ด์ง€์˜ ๋งํฌ๋ฅผ ๊ณต์œ ํ•  ๋•Œ ๋‚˜ํƒ€๋‚˜๋Š” ๋ฏธ๋ฆฌ ๋ณด๊ธฐ๋ฅผ ์„ค์ •ํ•˜๋Š” ํƒœ๊ทธ ๋ฉ”ํƒ€ ํƒœ๊ทธ์˜ ์ข…๋ฅ˜ ์ค‘ ํ•˜๋‚˜๋กœ, ‘์ œ๋ชฉ, ์„ค๋ช…, ์ด๋ฏธ์ง€, ๋งํฌ, ํƒ€์ž…’ ๋“ฑ์„ ์‚ฝ์ž…ํ•  ์ˆ˜ ์žˆ์Œ. โœ… favicon ์ฃผ์†Œ์ฐฝ์˜ ์ฆ๊ฒจ์ฐพ๊ธฐ ์•„์ด์ฝ˜ โœ… ogํƒœ๊ทธ์™€ favicon ์„ค์ •

[๋‚˜๋งŒ์˜ ๋‹จ์–ด์žฅ] 10. ๋ชฉ๋กํŽ˜์ด์ง€ - ์‚ฌ์ „์— ์—†๋Š” ๋‹จ์–ด์ผ ๋•Œ

โœ… API์—์„œ ๋‹จ์–ด ๋œป ์ฐพ์•„์„œ detail.html๋กœ ๊ฒฐ๊ณผ ๋ณด๋‚ด๋Š” ์„œ๋ฒ„ ํ•จ์ˆ˜ ๅ…ง r = requests.get(f"", headers={"Authorization": "Token [๋‚ดํ† ํฐ]"}) result = r.json() print(result) detail.html์— ๋ณด๋‚ด์ง€๋Š” result๋ผ๋Š” ๊ฐ’์„ ์‚ฌ์ „ API์—์„œ ์ฐพ์„ ์ˆ˜ ์—†์–ด์„œ ‘์ •์˜๋ฅผ ์ฐพ์„ ์ˆ˜ ์—†๋‹ค’๋Š” ๋ฉ”์‹œ์ง€ ์ฆ‰, ๋‹ค๋ฅธ ํ˜•ํƒœ์˜ ๋ฐ์ดํ„ฐ๋ฅผ ์ฃผ๊ธฐ ๋•Œ๋ฌธ์— ์ฒ˜๋ฆฌํ•˜์ง€ ๋ชปํ•ด์„œ ์—๋Ÿฌ ๋ฐœ์ƒ ! ์ด ๋•Œ ์—๋Ÿฌ๋ฅผ ๋ณด์—ฌ์ฃผ์ง€ ์•Š๊ณ  ๋‹จ์–ด ๋ชฉ๋ก ํŽ˜์ด์ง€๋กœ ๋ฆฌ๋‹ค์ด๋ ‰ํŒ… ํ•ด์•ผํ•จ โœ… ๊ฐ’์„ ์ž˜ ๋ฐ›์•„์™”์„ ๋•Œ์˜ ์ƒํƒœ์ฝ”๋“œ๊ฐ€ 200์ด๋ฏ€๋กœ 200์ด ์•„๋‹ ๋•Œ ๋ฉ”์ธํŽ˜์ด์ง€๋กœ ๋ฆฌ๋‹ค์ด๋ ‰ํŒ… ์‹œํ‚ค๊ณ  ‘๋‹จ์–ด๋ฅผ ์ฐพ์„ ์ˆ˜ ์—†๋‹ค’๋Š” ๋ฉ”์‹œ์ง€ ๋‚จ๊ฒจ์ฃผ๊ธฐ if r.status_code != 200: return red..

[๋‚˜๋งŒ์˜ ๋‹จ์–ด์žฅ] 9. ๋ชฉ๋กํŽ˜์ด์ง€ - ๊ฒ€์ƒ‰ ๊ธฐ๋Šฅ ๋งŒ๋“ค๊ธฐ

๋‹จ์–ด์žฅ์— ๋‹จ์–ด๊ฐ€ ์žˆ์œผ๋ฉด ๋‹จ์–ด์žฅ ํ•˜์ด๋ผ์ดํŠธ ์—†์œผ๋ฉด ์‚ฌ์ „์— ์žˆ๋Š” ๋‹จ์–ด์ด๋ฉด ์ƒ์„ธํŽ˜์ด์ง€๋กœ ์ด๋™ ์‚ฌ์ „์— ์—†๋Š” ๋‹จ์–ด๋ฉด ‘์—†๋Š” ๋‹จ์–ด’ ํ‘œ์‹œ โœ… ๊ฒ€์ƒ‰์„ ์œ„ํ•ด word ํ‚ค ๊ฐ’๋งŒ ๋ชจ์—ฌ์žˆ๋Š” word_list ๋งŒ๋“ค๊ธฐ let words = {{ words|tojson }}; //'์ด ๋ถ€๋ถ„์€ Html ์ฝ”๋“œ๊ฐ€ ์•„๋‹ˆ๊ณ  ์ง„์งœ ๋ฐ์ดํ„ฐ'๋ผ๊ณ  ๋งํ•ด์ฃผ๊ธฐ ์œ„ํ•ด tojson์„ ์‚ฌ์šฉ let word_list = []; //๋”•์…”๋„ˆ๋ฆฌ์—์„œ ๋‹จ์–ด๋“ค๋งŒ ๋ชจ์œผ๊ธฐ ์œ„ํ•œ list ์ƒ์„ฑ for (let i = 0; i < words.length; i++) { //words์˜ ๊ธธ์ด๋ณด๋‹ค ์งง์€ ๋™์•ˆ ๋ฐ˜๋ณต word_list.push(words[i]["word"]) //words์˜ i๋ฒˆ์งธ์˜ word ํ‚ค ๊ฐ’์„ word_list ์•ˆ์— ํ•˜๋‚˜์”ฉ ๋„ฃ์Œ } tojson ์ „ tojso..

[๋‚˜๋งŒ์˜ ๋‹จ์–ด์žฅ] 7. ์ƒ์„ธํŽ˜์ด์ง€ - ์ €์žฅ & ์‚ญ์ œ ๊ธฐ๋Šฅ ๋งŒ๋“ค๊ธฐ

1. ์ƒˆ ๋‹จ์–ด / ๊ธฐ์กด ๋‹จ์–ด ๊ตฌ๋ถ„ โœ… url ์˜ˆ์‹œ localhost:5000/detail/hello?status_give=new ⇒ ๐Ÿ’พ ๋ฒ„ํŠผ localhost:5000/detail/hello?status_give=old ⇒ ๐Ÿ—‘๏ธ๋ฒ„ํŠผ status_receive = request.args.get("status_give", "new") # status_give ๋ผ๋Š” ํŒŒ๋ผ๋ฏธํ„ฐ๋ฅผ status_receive ๋ผ๋Š” ์ด๋ฆ„์œผ๋กœ ๋ฐ›์Œ # status_give ๋ผ๋Š” ํŒŒ๋ผ๋ฏธํ„ฐ๋ฅผ ์ฃผ์ง€ ์•Š์„ ๊ฒฝ์šฐ๋ฅผ ๋Œ€๋น„ํ•ด, ๊ธฐ๋ณธ๊ฐ’์„ "new"๋กœ ์ฃผ๋„๋ก ํ•จ. return render_template("detail.html", word=keyword, result=result, status=status_receive) # detail.html์— s..

[๋‚˜๋งŒ์˜ ๋‹จ์–ด์žฅ] 6. ์ƒ์„ธํŽ˜์ด์ง€ - jinja2๋กœ ๋‹จ์–ด ๋œป ๊ฐ€์ ธ์˜ค๊ธฐ

Jinja2 ํ…œํ”Œ๋ฆฟ ์–ธ์–ด Flask ํ”„๋ ˆ์ž„์›Œํฌ์—์„œ ์‚ฌ์šฉํ•˜๋Š” ํ…œํ”Œ๋ฆฟ ์–ธ์–ด. ‘ํ…œํ”Œ๋ฆฟ’์ด ๋˜๋Š” Html ๋ฌธ์„œ์— ๋ฐ์ดํ„ฐ๊ฐ€ ๋“ค์–ด๊ฐˆ ๊ณณ์„ ํ‘œ์‹œํ•ด๋†“๋Š” ์—ญํ• ์„ ํ•ฉ๋‹ˆ๋‹ค. ํŒŒ์ด์ฐธ > setting > Template Languages > Jinja2 ์„ค์ • โœ… Owlbot API ์š”์ฒญ Flask r = requests.get(f"", headers={"Authorization": "Token [๋‚ดํ† ํฐ]"}) result = r.json() print(result) โœ… jinja2๋ฅผ ์ด์šฉํ•ด์„œ detail.html์— ๊ฐ’์„ ์ฑ„์›Œ ๋„ฃ์–ด์ฃผ๊ธฐ ์œ„ํ•ด detil.html๊ณผ ์—ฐ๊ฒฐ๋˜์–ด ์žˆ๋Š” detail ํ•จ์ˆ˜ ์•ˆ์— ์‚ฌ์ „ API์— ์š”์ฒญ์„ ๋ณด๋‚ด๊ณ  ๊ฐ’์„ ๋ฐ›์•„์˜ค๋Š” ๋ถ€๋ถ„์ด ํ•„์š”. @app.route('/detail/') def detail(keywo..

[๋‚˜๋งŒ์˜ ๋‹จ์–ด์žฅ] 5. ์ƒ์„ธํŽ˜์ด์ง€ - Ajax๋กœ ๋‹จ์–ด ๋œป ๊ฐ€์ ธ์˜ค๊ธฐ

Ajax ๊ธฐ๋ณธ ๊ณจ๊ฒฉ $.ajax({ type: "GET", //GET ๋ฐฉ์‹์œผ๋กœ ์š”์ฒญ url: "์—ฌ๊ธฐ์—URL์„์ž…๋ ฅ", //์š”์ฒญํ•  url data: {}, //์š”์ฒญํ•˜๋ฉด์„œ ํ•จ๊ป˜ ์ค„ ๋ฐ์ดํ„ฐ (GET ์š”์ฒญ ์‹œ์—” ๋น„์›Œ๋‘ ) success: function(response){ //์„ฑ๊ณตํ•˜๋ฉด, response ๊ฐ’์— ์„œ๋ฒ„์˜ ๊ฒฐ๊ณผ ๊ฐ’์„ ๋‹ด์•„์„œ ํ•จ์ˆ˜ ์‹คํ–‰ console.log(response) } }) html์—์„œ ๋‹จ์–ด ๋œป ๋ณด์—ฌ์ฃผ๊ธฐ โœ… API์—์„œ ๋‹จ์–ด ๋œป ์ฐพ์•„์„œ ๊ฒฐ๊ณผ ๋ณด๋‚ด์ฃผ๊ธฐ @app.route('/detail/') def detail(keyword): # API์—์„œ ๋‹จ์–ด ๋œป ์ฐพ์•„์„œ ๊ฒฐ๊ณผ ๋ณด๋‚ด๊ธฐ return render_template("detail.html", word=keyword) # ๋ฅผ detail.html์— word๋ผ..

[๋‚˜๋งŒ์˜ ๋‹จ์–ด์žฅ] 4. ํ”„๋กœ์ ํŠธ ์„ธํŒ…

โœ… AWS ์„œ๋ฒ„์™€ MongoDB ์—ฐ๊ฒฐ (app.py) client = MongoClient('15.164.98.36', 27017, username="test", password="test") db = client.dbsparta_plus_week2 ๋กœ์ปฌ์—์„œ ๊ฐœ๋ฐœํ•  ๋•Œ AWS ์„œ๋ฒ„์— ์žˆ๋Š” MongoDB๋ฅผ ๋ฐ”๋กœ ์—ฐ๊ฒฐํ•ด์„œ ์ฝ”๋”ฉํ•˜๋ฉด ๋‚˜์ค‘์— ๋ฐฐํฌํ•  ๋•Œ DB๋ฅผ ๋ณต์‚ฌํ•ด ์˜ฎ๊ธธ ํ•„์š”๊ฐ€ ์—†์–ด ํŽธํ•จ.

๋ฐ˜์‘ํ˜•