얼음꽃의 일지

1주차에 만든 팬명록에 날씨 추가하기

배운 내용을 가지고 만든 부분이기 때문에 따로 설명 없이 올려놓겠습니다. 벤(Ban) 팬명록 현재기온: 00.0 닉네임 응원댓글 응원 남기기 새로운 앨범 너무 멋져요! 세균맨 새로운 앨범 너무 멋져요! 호빵맨 새로운 앨범 너무 멋져요! 식빵맨 결과입니다.

JQuery + Ajax의 조합

JQuery + Ajax 로 합쳐진 문제를 풀기에 앞서 먼저 Ajax를 설명해드리겠습니다. Ajax는 어렵고, 다양한 작업을 웹페이지에 구현하기 위해서 웹페이지와 상호 작용할 수 있도록 하는 기술이라고 보시면 되는데요. 이 Ajax의 형태를 보여드리면 다음과 같습니다. Ajax코드에서 type은 GET, POST방식을 다 받을 수 있는데 지금은 GET만 사용하고 나중에 POST 사용 법을 추가로 작성하겠습니다. url은 요청할 url , data는 요청하면서 함께 줄 데이터 인데 단순히 데이터를 받아오는 경우에는 줄 내용이 없으니 비워두시면 됩니다. 성공적으로 받아오는 경우에 대해서 success에 어떤 방식으로 결과를 나타낼지 코드를 작성해 주면 됩니다. 문제를 통해서 확인 해보도록 하겠습니다. 문제를..

서버-클라이언트 통신 이해하기

Ajax를 시작하기에 앞서 서버-클라이언트 통신을 먼저 이해해보고자 합니다. 서버 -> 클라이언트 : JSON 과 클라이언트 -> 서버 : GET 요청으로 볼 수 있는데 JSON을 먼저 보여드리면 이런 형태입니다. (참고로 OpenAPI 자체를 올려드릴 수는 없으므로, 공공데이터포털기관에서 API를 가져오는 방법도 존재하니 검색해보시면 좋을거 같습니다. 현재 사진은 배운 수업 자료의 일부분 입니다.) 이 형태를 좀 더 나눠서 보여드리면 다음과 같습니다. 다른 언어들을 포함에서 딕셔너리를 배우셨다면 형태가 많이 익숙하실껍니다. 즉, JSON은 Key:Value로 이루어진 딕셔너리라는 것을 알 수 있습니다. ( 혹시 딕셔너리가 무엇인지 잘 모르시는 분들은 구글링 해서 찾아보시는걸 추천 드립니다. ) 우리가 ..

jQuery의 간단한 설명

1주차 영상에서 간단하게 JavaScript를 넣으면서 "$"는 나중에 다시 설명하겠다고 한적이 있습니다. 혹시 어디서 그런 얘기를 했던거지? 하시면 https://iceflower.tistory.com/7 기록하기 버튼과 기록하는 창을 연결하기 앞서.... 기록하기 버튼과 기록하는 창이 무엇인지 모르겠다, 이 글이 처음이다 하시는 분은 https://iceflower.tistory.com/6 부트 스트랩을 추가 이용해보자! 이전 웹페이지에 부트 스트랩을 추가하여 영화가 들 iceflower.tistory.com 이전 게시물 한번 보고 오시는걸 추천드립니다. 이제 함수부분을 설명하면서 $("#post-box").show() $("#post-box").hide() 는 그냥 id를 받아와서 보여주고, 숨겨준..