서버-클라이언트 통신 / Ajax
HTML+CSS+JS+Flask/jQuery+Ajax2021. 6. 12. 17:01서버-클라이언트 통신 / Ajax

서버↔클라이언트 통신 아래 HTTP 프로토콜 관련 글을 먼저 읽어보자! https://duckgugong.tistory.com/156 HTTP HTTP (Hypertext Transfer Protocol) HTTP는 서버와 클라이언트가 인터넷상에서 데이터를 주고받기 위한 프로토콜(Protocol)이다 HTTP는 HTML 문서와 같은 리소스들을 가져올 수 있도록 해주는 프로토콜이다. duckgugong.tistory.com 서버→클라이언트 Ajax는 Javascript로 페이지 전환 없이 서버에서 값을 받아올 수 있는 방법이다. 클라이언트가 서버에게 데이터를 요청할 때 서버에서 클라이언트에게 데이터를 주는 포맷을 "JSON"이라고 한다. JSON은 아래와 같이 Key:Value로 이루어져 있다. 여기를 클..

HTML+CSS+JS+Flask/jQuery+Ajax2021. 6. 12. 13:32JQuery 사용해서 기능 구현 + 퀴즈

버튼을 눌렀을 때, 엘리먼트 숨기거나 보이게 하기 아래와 같은 화면에서 '포스팅박스 열기' 버튼을 누르면 숨겨진 창이 나타나고 버튼의 내용이 '포스팅박스 닫기'로 바뀌고 다시 한 번 버튼을 클릭하면 원래 모습으로 돌아가도록 구현해보자. 아래에서 function openclose() 부분을 채워서 기능을 완성시키자! jQuery의 show() / hide() 기능을 사용해서 구현하자. 나홀로 링크 메모장! 중요한 링크를 저장해두고, 나중에 볼 수 있는 공간입니다 포스팅박스 열기 아티클 URL 간단 코멘트 기사 저장 display 속성을 이용해서 클릭시에 요소가 보이거나 안보이게 하기 openclose() 부분을 아래처럼 display의 속성을 조건문과 이용해서 element를 보이게/안보이게 하거나 텍스트..

JQuery
HTML+CSS+JS+Flask/jQuery+Ajax2021. 6. 12. 03:42JQuery

JavaScript 복습 버튼을 홀수번 클릭하면 홀수라고 알려주고 짝수번 클릭하면 짝수라고 알려주는 버튼을 만들어보자! click me! JQuery HTML의 요소들을 조작하는, 편리한 Javascript를 미리 작성해 둔 것. 라이브러리! Javascript로도 모든 기능을 구현할 수 있지만, 코드가 복잡하고 브라우저간 호환성 문제도 고려해야 해서 JQuery가 등장했다! JQuery는 미리 Javascript로 작성된 코드이기 때문에 쓰기전에 꼭 임포트 해야한다! JQuery VS Javascript 특정 요소 하나를 감추는 코드를 비교해보자. JQuery는 매우 직관적이다! Javascript document.getElementById("element").style.display = "none";..

자바스크립트
HTML+CSS+JS+Flask/HTML+CSS+JS2021. 6. 11. 14:11자바스크립트

Javascript 프로그래밍 언어 중 하나로, 브라우저가 알아들을 수 있는 언어이다. 자바와 자바스크립트는 아무 관련이 없다. 웹페이지가 동적으로 작동할 수 있게 도와주는 언어이다! 안에 로 공간을 만들어 작성한다. 그리고 아래처럼 해당 함수가 불리기 원하는 태그에 이벤트를 달아서 함수가 불리게 하자. 기사저장 자바스크립트 문법 아래 링크에 들어가서 열심히 정리해둔거 보고 알아두자. https://duckgugong.tistory.com/category/%EB%A6%AC%EC%95%A1%ED%8A%B8%20%EA%B8%B0%EC%B4%88/ES5%20%26%20ES6?page=2 '리액트 기초/ES5 & ES6' 카테고리의 글 목록 (2 Page) 주니어 개발자에욤 duckgugong.tistory.com

image