Language20 브라우저 환경의 자바스크립트 DOM (Document Object Model) HTML, XML 문서의 프로그래밍 interface 문서의 구조화된 표현을 제공하며 프로그래밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공하여 그들이 문서 구조, 스타일, 내용 등을 변경할 수 있게 도움 nodes와 objects로 문서 표현 웹 페이지를 스크립트 또는 프로그래밍 언어들에서 사용될 수 있게 연결시켜주는 역할 담당 브라우저 렌더링 순서 html 다운로드 → dom tree link 태그를 만나면 css 다운로드 → cssom tree script 만나면 해석이 끝날 때까지 렌더링 중지 img와 같은 외부 리소스 파싱 dom과 cssom 합쳐서 render tree 생성 layout (reflow) : 배치, 배치가 바뀌지 않으면 do.. 2022. 7. 13. JS 복습 심화 자바스크립트 웹페이지에 생동감을 불어넣기 위해 만들어진 프로그래밍 언어이며, 자바스크립트 엔진이 있는 모든 디바이스에서 동작한다. 브라우저 뿐만 아니라 서버에서도 실행 가능하다. 브라우저의 자바스크립트 - 페이지에 새로운 HTML을 추가하거나 기존 HTML, 스타일 수정하기 - 사용자 행동에 반응하기 (event) - 네트워크를 통해 원격 서버에 요청을 보내거나, 파일 다운로드/업로드하기 (Ajax, comet...) - 쿠키를 가져오거나 설정하기 - 사용자에게 질문을 건네거나 메시지 보여주기 - 클라이언트 측에 데이터 저장하기 (local storage, session storage) 서버의 자바스크립트 - 보안을 위해서, 브라우저에서 자바스크립트 기능에 제약 걸어 놓음 - 서버에서는 브라우저에서 제약.. 2022. 7. 13. [JS 비동기] HTTP, Ajax, 동기/비동기 통신 HTTP (Hyper Text Transfer Protocol) 브라우저와 서버 간에 데이터를 주고 받기 위한 방식이다. 프로토콜은 '나는 이렇게 줄 테니 넌 이렇게 받고, 난 너가 준거 그렇게 받을게'라는 일종의 약속이다. HTTP는 각각의 데이터 요청이 서로 독립적으로 관리된다는 것이 특징이며, 이를 stateless하다고 한다. HTTP는 TCP/IP 통신 위에서 동작한다. (기본 포트 80번) 더보기 TCP/IP - TCP와 IP를 합쳐서 부르는 말 - TCP/IP를 사용한다 = IP 주소 체계를 따르고, IP Routing을 이용하며, TCP의 특성을 활용하겠다. - IP 주소 사용하여 데이터를 전달 - 데이터가 제대로 갔는지, 속도는 적당한지, 제대로 받았다는 연락이 오는지 체크 TCP - 전.. 2022. 7. 1. 웹사이트 내에 랜덤으로 이미지 노출시키기 최근 만든 웹사이트(트위터 맛집 검색기 https://twitter-michelin-guide.netlify.app/)의 주 사용층이 아이돌 팬들이기 때문에, 초반에는 하루씩 돌려가면서 트친들이 좋아하는 아이돌 사진을 올려주었다. 그렇지만 세상은 넓고 아이돌은 많기 때문에 한번에 다 올려서 창이 새로고침 될때마다 다르게 띄워줘야겠다는 생각을 했다. (그럼 최애 찾으려고 새로고침도 많이하고 사이트 방문도 많이하고 읍읍..) 초보 개발자에게 웹사이트 개발은 구글링-복붙-고치기의 연속이 아닐까... 반박시 님들 말이 다 맞음. 내가 잘 몰라.. 암튼 그렇게 구글링을 했는데,, 이게 언어도 다양하고 (개발 언어든, 말하는 언어든,,,) 쉽게 적용하기가 어렵더라...구요... 그래서 여러 코드 참고해서, 제가 돌.. 2022. 1. 26. 이전 1 2 3 4 5 다음
