ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • ์›น๊ฐœ๋ฐœ ๊ธฐ๋ณธ ๋ฐฐ๊ฒฝ์ง€์‹
    ๐Ÿ’ปProgramming/Web 2023. 3. 16. 22:05

    HTML/CSS/React.js: ํ”„๋ก ํŠธ์—”๋“œ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ๊ฐœ๋ฐœ์— ์‚ฌ์šฉ๋˜๋Š” ์–ธ์–ด๋“ค.

    ์Šคํ”„๋ง ๋ถ€ํŠธ: ์Šคํ”„๋ง์œผ๋กœ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๋งŒ๋“ค ๋•Œ์— ํ•„์š”ํ•œ ์„ค์ •์„ ๊ฐ„ํŽธํ•˜๊ฒŒ ์ฒ˜๋ฆฌํ•ด์ฃผ๋Š” ๋ณ„๋„์˜ ํ”„๋ ˆ์ž„์›Œํฌ(์ถœ์ฒ˜: https://www.codestates.com/blog/content/์Šคํ”„๋ง-์Šคํ”„๋ง๋ถ€ํŠธ)

    AWS: ํด๋ผ์šฐ๋“œ ํ”Œ๋žซํผ. ์ปดํ“จํŒ…, ์Šคํ† ๋ฆฌ์ง€, ๋ฐ์ดํ„ฐ๋ฒ ์ด์Šค์™€ ๊ฐ™์€ ์ธํ”„๋ผ ๊ธฐ์ˆ ๋ถ€ํ„ฐ, ์ธ๊ณต์ง€๋Šฅ, ๋ฐ์ดํ„ฐ ๋ ˆ์ดํฌ ๋ฐ ๋ถ„์„, ์‚ฌ๋ฌผ ์ธํ„ฐ๋„ท ๋“ฑ์˜ ๊ธฐ์ˆ ๊นŒ์ง€ ํด๋ผ์šฐ๋“œ๋กœ ํ•  ์ˆ˜ ์žˆ๋Š” ๊ฑฐ์˜ ๋ชจ๋“  ๊ฒƒ์„ ๊ตฌ์ถ• ๊ฐ€๋Šฅํ•œ ์•„๋งˆ์กด ์›น ์„œ๋น„์Šค.

    (์—ฌ๊ธฐ์„œ ํ”„๋กœ๋•์…˜ ํ™˜๊ฒฝ์ด๋ž€? ์†Œํ”„ํŠธ์›จ์–ด ๋ฐ ๊ธฐํƒ€ ์ œํ’ˆ์ด ์‹ค์ œ๋กœ ์ตœ์ข… ์†Œํ”„ํŠธ์›จ์–ด ๋ฐ ๊ธฐํƒ€ ์ œํ’ˆ์ด ์‹ค์ œ๋กœ ์ตœ์ข… ์‚ฌ์šฉ์ž๊ฐ€ ์˜๋„ํ•œ ์šฉ๋„๋กœ ์ž‘๋™ํ•˜๋Š” ์„ค์ •์„ ์„ค๋ช…ํ•˜๊ธฐ ์œ„ํ•ด ๊ฐœ๋ฐœ์ž๊ฐ€ ์ฃผ๋กœ ์‚ฌ์šฉํ•˜๋Š” ์šฉ์–ด-์ถœ์ฒ˜:https://ko.theastrologypage.com/production-environment)

     

    HTTP(HyperText Transfer Protocol): ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ๋ ˆ๋ฒจ์˜ ํ•˜์ดํผํ…์ŠคํŠธ๋ฅผ ๋น ๋ฅด๊ฒŒ ๊ตํ™˜ํ•˜๊ธฐ ์œ„ํ•œ ํ•œ๋งˆ๋””๋กœ ์„œ๋ฒ„์™€ ํด๋ผ์ด์–ธํŠธ์˜ ์‚ฌ์ด์—์„œ ์–ด๋–ป๊ฒŒ ๋ฉ”์‹œ์ง€๋ฅผ ๊ตํ™˜ํ• ์ง€์— ๋Œ€ํ•œ ๊ทœ์•ฝ. ์šฐ๋ฆฌ๊ฐ€ ์ธํ„ฐ๋„ท์„ ์‚ฌ์šฉํ•  ๋•Œ, ์•ž์— http://๋ฅผ ๋ถ™์ด๋Š”๋ฐ, ์ด๊ฒŒ ๋ฐ”๋กœ ํ”„๋กœํ† ์ฝœ์„ ์‚ฌ์šฉํ•ด์„œ ์ •๋ณด๋ฅผ ๊ตํ™˜ํ•˜๊ฒ ๋‹ค๋Š” ๋ง์ด๋‹ค. ๋„คํŠธ์›Œํฌ ํ”„๋กœํ† ์ฝœ. 

     

    ํ•˜์ดํผ ํ…์ŠคํŠธ๋ž€?: ์ดˆ๊ธฐ์˜ ์˜๋ฏธ๋Š” ๋‹ค๋ฅธ ๋ฌธ์„œ๋กœ ํ–ฅํ•˜๋Š” ๋งํฌ๊ฐ€ ์žˆ๋Š” ํ…์ŠคํŠธ. ํ•˜์ดํผ ํ…์ŠคํŠธ๋ฅผ ์ง€์ •ํ•˜๊ธฐ ์œ„ํ•ด์„œ๋Š” HyperText Markup Language->HTML์„ ์‚ฌ์šฉํ•ด์•ผํ•จ.

     

    HTTP๋Š” ์–ด๋–ป๊ฒŒ ๋™์ž‘ํ•˜๋Š”๊ฐ€?

    ์‚ฌ์šฉ์ž๋Š” ๋ธŒ๋ผ์šฐ์ €๋ผ๋Š” ๋งค๊ฐœ์ฒด(?)๋ฅผ ํ†ตํ•ด ์„œ๋ฒ„์— HTTP ์š”์ฒญ์„ ๋ณด๋‚ผ ์ˆ˜ ์žˆ๋‹ค.(์ฃผ์†Œ์ฐฝ์— ์›ํ•˜๋Š” ๋งํฌ๋ฅผ ์น˜๊ฑฐ๋‚˜ ๋ณต์‚ฌํ•˜์—ฌ ์—”ํ„ฐ๋ฅผ ๋ˆ„๋ฆ„์œผ๋กœ์จ.) ๊ทธ๋ฆฌ๊ณ  ์ด ์„œ๋ฒ„๋Š” ์ด request๋ฅผ ๋ฐ›์•„ HTTP์‘๋‹ต์„ ๋ธŒ๋ผ์šฐ์ €์— ๋„์›Œ์ค€๋‹ค(๋žœ๋”๋ง). 

     

    HTTP ์š”์ฒญ

    ์ด ์š”์ฒญ์—๋Š” ์†ก์‹ ์ž์˜ ๋‹ค์–‘ํ•œ ์ •๋ณด๊ฐ€ ๋‹ด๊ฒจ ์žˆ๋‹ค. HTTP์š”์ฒญ์—๋Š” ์—ฌ๋Ÿฌ๊ฐ€์ง€ ๋ฉ”์„œ๋“œ๋“ค(GET, POST, PUT, DELETE)์ด ์žˆ๋‹ค. ์ด ๋ฉ”์„œ๋“œ๋ฅผ ํ†ตํ•ด์„œ ํ˜ธ์ŠคํŠธ์—๊ฒŒ ์›ํ•˜๋Š” ์š”์ฒญ์„ ํ•˜๋Š” ๊ฒƒ(์ง€์ •ํ•œ ์ž์›์— ํ•˜๊ณ  ์‹ถ์€ ์ž‘์—…์„ ์•Œ๋ ค์ฃผ๋Š”)์ด๋‹ค. 

     

    HTTP ์‘๋‹ต

    HTTP ์‘๋‹ต ์ฝ”๋“œ์—๋Š” ์ƒํƒœ ์ฝ”๋“œ๊ฐ€ ์žˆ๋‹ค. 

    ์ด ์ƒํƒœ์ฝ”๋“œ์—์„œ, ์˜ˆ๋ฅผ๋“ค์–ด 200์€ ์„ฑ๊ณต์ ์œผ๋กœ ์š”์ฒญ์„ ์ฒ˜๋ฆฌํ–ˆ๋‹ค๋Š” ์˜๋ฏธ์ด๋‹ค. 404๋Š” ํ•ด๋‹น ๋ฆฌ์†Œ์Šค๋Š” ์กด์žฌํ•˜์ง€ ์•Š๋Š”๋‹ค๋Š” ์˜๋ฏธ, 403๋Š” ํ•ด๋‹น ์†ก์‹ ์ž์—๊ฒŒ ๋ฆฌ์†Œ์Šค์— ์ ‘๊ทผํ•  ์ˆ˜ ์žˆ๋Š” ๊ถŒํ•œ์ด ์—†๋‹ค๋Š” ์˜๋ฏธ, 500์€ ์„œ๋ฒ„์˜ ์—๋Ÿฌ๋กœ ์ธํ•ด ์š”์ฒญ์„ ์ฒ˜๋ฆฌํ•  ์ˆ˜ ์—†๋‹ค๋Š” ์˜๋ฏธ. ์•ž์— ์–ธ๊ธ‰ํ•œ ๊ฒƒ ์™ธ์—๋„ ๋‹ค๋ฅธ ์ƒํƒœ์ฝ”๋“œ๋“ค๋„ ์กด์žฌํ•œ๋‹ค. ๋˜, ์‘๋‹ต ์ฝ”๋“œ์—๋Š” ๋ฏธ๋””์–ด ํƒ€์ž…(๋น„๋””์˜ค, ํ…์ŠคํŠธ, ์ด๋ฏธ์ง€...)์„ ๋‚˜ํƒ€๋‚ด๋Š” ์ฝ”๋“œ๋„ ์žˆ๋‹ค.

     

    JSON(JavaScript Object Notation)

    ๊ฐ์ฒด(object)๋ฅผ ํ‘œํ˜„ํ•˜๊ธฐ ์œ„ํ•œ ํ…์ŠคํŠธ. ํ‚ค์™€ ๊ฐ’(key and value)๋กœ ๊ฐ์ฒด๋ฅผ ํ‘œํ˜„ํ•œ ๋ฌธ์ž์—ด. JavaScript์—์„œ ๊ฐ์ฒด๋ฅผ ์ƒ์„ฑํ•˜๋Š” ํ˜•์‹๊ณผ ๊ฐ™๊ธฐ ๋•Œ๋ฌธ์— JavaScript Object Notation์ด๋ผ๊ณ  ํ•œ๋‹ค. ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์—์„œ ๋‹ค๋ฅธ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์œผ๋กœ ๊ฐ์ฒด๋ฅผ ์„œ๋กœ ๋„˜๊ฒจ์ฃผ๊ณ  ๋„˜๊ฒจ๋ฐ›์•„์•ผ ํ•˜๋Š” ์ƒํ™ฉ์ด๋ผ๊ณ  ํ•˜์˜€์„ ๋•Œ ์ด ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜๋“ค์€ ์„œ๋กœ ๋‹ค๋ฅธ ์–ธ์–ด์™€ ์•„ํ‚คํ…์ฒ˜๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์„œ๋กœ ํ†ต์‹ ํ•˜๊ธฐ ์–ด๋ ต๋‹ค. ๊ทธ๋ ‡๊ธฐ ๋•Œ๋ฌธ์— ์„œ๋กœ๊ฐ€ ์ดํ•ดํ•  ์ˆ˜ ์žˆ๋Š” ํ˜•ํƒœ๋กœ ๊ฐ์ฒด๋ฅผ ๋ฐ”๊ฟ”์ฃผ์–ด์•ผ ํ•œ๋‹ค. ์ด๋ ‡๊ฒŒ ๊ฐ์ฒด๋ฅผ ์ „๋‹ฌํ•˜๊ฑฐ๋‚˜ ์ €์žฅํ•˜๊ธฐ ์œ„ํ•ด์„œ ๋‹ค๋ฅธ ํ˜•์‹์œผ๋กœ ๋ฐ”๊พธ๋Š” ์ž‘์—…์„ ์ง๋ ฌํ™”, ๊ทธ ๋ฐ˜๋Œ€์˜ ์ž‘์—…์„ ์—ญ์ง๋ ฌํ™”๋ผ๊ณ  ํ•จ. ๊ทธ ๋ฐฉ๋ฒ•์ด ๋ฐ”๋กœ JSON์ด๋‹ค. 


    {

        "name":"sujin"

        "age":13

    }


    ์ด๋Ÿฐ์‹์œผ๋กœ ๊ฐ์ฒด๋ฅผ ํ‘œํ˜„ํ•œ๋‹ค. 

    JSON์˜ ์ž๋ฃŒํ˜•: Boolean, ์ˆซ์ž, ๋ฌธ์ž์—ด, ์˜ค๋ธŒ์ ํŠธ, ๋ฐฐ์—ด

     

    ์„œ๋ฒ„๋ž€?

    ์„œ๋ฒ„๋ž€ ํ”„๋กœ๊ทธ๋žจ์ด๋‹ค. ์„œ๋ฒ„๋Š” network operation์„ ์ˆ˜ํ–‰ํ•˜๋Š” ํ”„๋กœ๊ทธ๋žจ.

     

    ์ •์  ์›น ์„œ๋ฒ„๋ž€?

    HTTP ์„œ๋ฒ„ ์ค‘์—์„œ๋„ ๋ฆฌ์†Œ์Šค ํŒŒ์ผ์„ ๋ฐ˜ํ™˜ํ•˜๋Š” ์„œ๋ฒ„๋ฅผ ์˜๋ฏธ. ์˜ˆ๋ฅผ๋“ค์–ด ํด๋ผ์ด์–ธํŠธ๊ฐ€ file.html ์š”์ฒญ์„ ์„œ๋ฒ„๋กœ ๋ณด๋‚ด๋ฉด ์ •์  ์›น ์„œ๋ฒ„๋Š” ์ง€์ •๋œ ๋””๋ ‰ํ† ๋ฆฌ ๊ฒฝ๋กœ์—์„œ file.html์„ ์ฐพ์•„์„œ HTTP ์‘๋‹ต ๋ฐ”๋””์— ๋„ฃ์–ด์„œ ์ „์†กํ•œ๋‹ค. ์ด ๋•Œ ์ •์  ์›น ์„œ๋ฒ„๋Š” ์ด file.html์— ์•„๋ฌด๋Ÿฐ ์ž‘์—…๋„ ํ•˜์ง€ ์•Š๊ณ , ํŒŒ์ผ์„ ๊ทธ๋Œ€๋กœ ๋ฐ˜ํ™˜ํ•œ๋‹ค. ๊ทธ๋ž˜์„œ ์ •์  ์›น ์„œ๋ฒ„์ด๋‹ค. 

    ์ •์  ์›น ์„œ๋ฒ„์˜ ์˜ˆ: ์•„ํŒŒ์น˜, Nginx ๋“ฑ

     

    ๋™์  ์›น ์„œ๋ฒ„๋ž€?

    ๋™์  ์›น ์„œ๋ฒ„๋Š” ์œ„์—์„œ ๋งํ•œ ์ •์  ์›น ์„œ๋ฒ„์™€ ๋‹ค๋ฅด๊ฒŒ ํŒŒ์ผ์„ ๊ทธ๋Œ€๋กœ ๋ฐ˜ํ™˜ํ•˜์ง€ ์•Š๋Š”๋‹ค. ๋™์  ์›น ์„œ๋ฒ„๋Š” ์š”์ฒญ์„ ์ฒ˜๋ฆฌํ•˜๊ณ , ๊ทธ ์ฒ˜๋ฆฌํ•œ ๊ฒฐ๊ณผ์— ๋”ฐ๋ผ ์‘๋‹ต ๋ฐ”๋””๋ฅผ ๋ณ€๊ฒฝํ•˜๊ฑฐ๋‚˜ ๋Œ€์ฒดํ•˜์—ฌ ๋ณด๋‚ธ๋‹ค. ์–ด๋–ค ์š”์ฒญ์ด๋˜์ง€ ๊ฐ„์— ํŒŒ์ผ์„ ๊ทธ๋Œ€๋กœ ๋ฐ˜ํ™˜ํ•˜๋Š” ์ •์  ์›น ์„œ๋ฒ„์™€ ๋‹ค๋ฅด๊ฒŒ ๋™์  ์›น ์„œ๋ฒ„๋Š” ํด๋ผ์ด์–ธํŠธ, ๋งค๊ฐœ๋ณ€์ˆ˜์— ๋”ฐ๋ผ ๊ฐ™์€ ์š”์ฒญ์ด๋ผ๋„ ๋‹ค๋ฅด๊ฒŒ ์‘๋‹ต์„ ๋ฐ›์„ ์ˆ˜ ์žˆ๋‹ค. 

     

    ์ž๋ฐ” ์„œ๋ธ”๋ฆฟ ์ปจํ…Œ์ด๋„ˆ/์—”์ง„์ด๋ž€?

    ์„œ๋ฒ„ ํ”„๋กœ๊ทธ๋žจ.

     

    CRUD

    -> Create, Retrieve, Update, Delete

    ์ƒ์„ฑ, ๊ฒ€์ƒ‰, ์ˆ˜์ •, ์‚ญ์ œ ๋„ค ๊ฐ€์ง€ ๊ธฐ๋ณธ ๊ธฐ๋Šฅ์„ ์˜๋ฏธ.

     

    REST API๋ž€?(์ถœ์ฒ˜, ์•„์ฃผ ์ž์„ธํ•˜๊ณ  ์นœ์ ˆํžˆ ๋‚˜์™€์žˆ์œผ๋‹ˆ ๋ณด๋Š”๊ฒƒ์„ ์ถ”์ฒœํ•ฉ๋‹ˆ๋‹ค!-https://gmlwjd9405.github.io/2018/09/21/rest-and-restful.html)

    REST API๋ฅผ ์„ค๋ช…ํ•˜๊ธฐ์— ์•ž์„œ REST์˜ ์˜๋ฏธ๋ฅผ ์•Œ์•„๋ณด์ž. REST๋ž€ Representational State Transfer์˜ ์•ฝ์ž๋กœ ์ž์›์„ ์ด๋ฆ„์œผ๋กœ ๊ตฌ๋ถ„ํ•˜์—ฌ ํ•ด๋‹น ์ž์›์˜ ์ƒํƒœ(์ •๋ณด)๋ฅผ ์ฃผ๊ณ ๋ฐ›๋Š” ๋ชจ๋“  ๊ฒƒ์„ ์˜๋ฏธํ•œ๋‹ค. API๋ž€ Application Programming Interface์˜ ์•ฝ์ž๋กœ ๋ฐ์ดํ„ฐ์™€ ๊ธฐ๋Šฅ์˜ ์ง‘ํ•ฉ์„ ์ œ๊ณตํ•˜์—ฌ ์ปดํ“จํ„ฐ ํ”„๋กœ๊ทธ๋žจ๊ฐ„ ์ƒํ˜ธ์ž‘์šฉ์„ ์ด‰์ง„ํ•˜๋ฉฐ, ์„œ๋กœ ์ •๋ณด๋ฅผ ๊ตํ™˜ ๊ฐ€๋Šฅํ•˜๊ฒŒ ํ•˜๋„๋ก ํ•˜๋Š” ๊ฒƒ. ๊ทธ๋ž˜์„œ REST API๋ž€ REST๊ธฐ๋ฐ˜์œผ๋กœ ์„œ๋น„์Šค API๋ฅผ ๊ตฌํ˜„ํ•˜๋Š” ๊ฒƒ์ด๋‹ค. ์ตœ๊ทผ OpenAPI, ๋งˆ์ดํฌ๋กœ ์„œ๋น„์Šค ๋“ฑ์„ ์ œ๊ณตํ•˜๋Š” ์—…์ฒด ๋Œ€๋ถ€๋ถ„์€ REST API๋ฅผ ์ œ๊ณตํ•œ๋‹ค.

    '๐Ÿ’ปProgramming > Web' ์นดํ…Œ๊ณ ๋ฆฌ์˜ ๋‹ค๋ฅธ ๊ธ€

    [Web] ์›น ์„œ๋ฒ„(Web Server)์™€ WAS(Web Application Server)์˜ ์ฐจ์ด  (0) 2024.04.16
Designed by Tistory.