오늘 만들어 본 것은 넷플릭스 영화 사이트 만들기
![](https://blog.kakaocdn.net/dn/JAJwG/btsEYYuXT4M/3BShkM4KcVzv7R73S8WKz1/img.png)
![](https://blog.kakaocdn.net/dn/FYmax/btsEWA2P4cV/uRQeq3WdFOp5E6Olhgoia0/img.png)
부트스크랩을 이용하면 좀 더 편리하게 내가 원하는 것들을 가져와서 이용할 수 있다.
![](https://blog.kakaocdn.net/dn/cHx1FE/btsE0pL8gCK/Indk7KcMi7gQqWjgF44RP0/img.png)
css 꾸미기까지는 여기까지
이제 자바스크립트를 이용하여 움직이는 것까지 표현
![](https://blog.kakaocdn.net/dn/begDdU/btsEZbnpKB8/NAViKTslV1VRedOf9XLFf1/img.png)
스크립트에 변수를 선언
![](https://blog.kakaocdn.net/dn/biFvOs/btsEYKX3klS/k4We0AHLM1QbVVMtiT9Zn1/img.png)
개발자간의 메모장 같은 계념으로 보면 된다...
![](https://blog.kakaocdn.net/dn/p8Kw5/btsE0iM5Skj/DtsOL4oDpNYFDvsQRY2ESk/img.png)
![](https://blog.kakaocdn.net/dn/bZgiyL/btsEZCLPVTd/oiXNzJekrUTKuJ8v727d8k/img.png)
리스트 방법
![](https://blog.kakaocdn.net/dn/Ja9D6/btsEWjmDKbe/12TE35bw09LrgVac25kXl0/img.png)
![](https://blog.kakaocdn.net/dn/eD3B8o/btsEZRIS3FI/PO9pmsudmSXIDymV3bg3SK/img.png)
딕션너리 방법
![](https://blog.kakaocdn.net/dn/sE2MZ/btsE0kqBM2v/VIe48Hyg9ThdwMKEX14qJK/img.png)
![](https://blog.kakaocdn.net/dn/lkE8S/btsE0iM5Ske/3ETzb68g1VK65YO7QLvql1/img.png)
조건문 if
![](https://blog.kakaocdn.net/dn/cpiv8B/btsEXrq0teP/4pDszzcvBJi3QWc0kU8f31/img.png)
함수를 이용하여 버튼을 누르면 값이 변경이 되는 코딩
![](https://blog.kakaocdn.net/dn/vHJmN/btsEYABfZih/jAmjxhoaYxIKKfQDsWHjHk/img.png)
리스트와 딕션너리로 만드는 함수
![](https://blog.kakaocdn.net/dn/upZOs/btsEZnutVKi/bh8FPVOFbjmbvnxQI1HdQK/img.png)
함수이용 버튼을 누르면 창이 생기거나 없어지도록
![](https://blog.kakaocdn.net/dn/3LUze/btsEXvUoArY/ukU9AGdgXjYBR9fWEGkxKK/img.png)
새로운 영화 추가
openapi : 공공으로 공유되는 정보
![](https://blog.kakaocdn.net/dn/b2BN8X/btsEWfxJ70P/evcx4zkI839qKQaBDxVGak/img.png)
openapi = 공유되는 정보들을 직접 받아서 볼 수 있다.(날씨, 영화, 노래 등등)
![](https://blog.kakaocdn.net/dn/cyVj2U/btsEZzhfLqz/ApZydObEdlgmEep0k5hEp1/img.png)
get = 인터넷 정보를 얻기위해 클라이언트가 서버에게 요청하는 거
![](https://blog.kakaocdn.net/dn/bBhXqp/btsEVIUx6JD/kBEmex0aikLCbFUv9TJki0/img.png)
jquery = 코딩을 간단하게 해주는 마법지팡이 같은 것 알아두면 아주 편하다
![](https://blog.kakaocdn.net/dn/80qye/btsEXp04I2W/dzyKFtpO2FY4Q9hpqCGlek/img.png)
fetch = 실시간 데이터를 받아서 반영하여 데이터를 넣어주는 것
![](https://blog.kakaocdn.net/dn/Rdxbq/btsEWLXsp6T/2tMv4PeMxuPc4VhVC4WU4K/img.png)
![](https://blog.kakaocdn.net/dn/bb1odz/btsEZcs5LRn/qXzzKOIrNHkgMAeKDyb2kK/img.png)
데이터 베이스에서 자료를 넣고 가져오는 코딩
![](https://blog.kakaocdn.net/dn/9cme6/btsEV7Gy3Kk/cwASpkaBsFPIlvSoOC2ekk/img.png)
깔끔하게 정리도 할 수 있다.
'AI 코딩 교육 TIL' 카테고리의 다른 글
2024-01-25 AI 코딩 TIL (0) | 2024.02.16 |
---|---|
2024-01-24 AI 코딩 TIL (0) | 2024.02.16 |
2024-01-22 AI 코딩 TIL (0) | 2024.02.16 |
2024-02-16 AI 코딩 TIL (1) | 2024.02.16 |
2024-02-15 AI 코딩 TIL (0) | 2024.02.15 |