본문 바로가기

TIL/HTML, CSS, JS 이것저것24

HEX 컬러 픽커 웹사이트 바닐라코딩 프렙사전단계 과제에 있던 HEX 컬러픽커 웹사이트를 만들어 보았습니다! spooky-scary-skeleton.github.io/Backgroundchanger/ HEXCOLOR PICKER spooky-scary-skeleton.github.io 2021. 3. 30.
자바스크립트 DOM (2021-03-22) 바닐라코딩 프렙 코스 사전과정을 공부하면서 배운내용을 간단하게 정리해보려 합니다. 틀리거나 잘못된 내용이 있다면 지적해주시면 감사하겠습니다 :) 사실 이전에 ZTM 강의를 듣고정리했을때는 DOM이 뭔지 개념적으로 잘 이해가 되지 않았었다. 그냥 특정 메소드를 쓰면 특정 HTML태그를 가져올수 있고 그걸 자바스크립트로 조작할수 있다는 것정도? lemonade-my-neck-was-drippin.tistory.com/30 DOM Manipulation(2021-02-09) - 웹개발을 배우기 위해 Udemy에서 the-complete-web-developer-zero-to-mastery를 수강한 내용을 정리하는 포스팅입니다. - 틀린점이있거나 다른 의견이 있으시다면 언제든지 댓글로 남겨주시면 감사하겠습 le.. 2021. 3. 22.
구글 페이지 클론 해보기 (2021-03-15) 바닐라코딩의 프렙 사전준비 가이드를 따라서 구글페이지를 클론해봤습니다. 구글 홈페이지가 간단하고 화면 크기 변경에 따른 대응과 CSS 애니메이션은 프렙 사전준비 지시사항대로 신경쓰지 않았는데 그래도 꽤 시간이 많이 걸렸네요... spooky-scary-skeleton.github.io/Google_clone/ Google spooky-scary-skeleton.github.io 2021. 3. 15.
웹 부트캠퍼를 위한 컴퓨터과학 (2021-02-28) 인터넷에서 자료를 검색하던도중 좋은 글을 발견하여 공유 합니다. csbooks.wisedog.net/ 들어가기에 앞서 - 웹 부트캠퍼를 위한 컴퓨터 과학 안녕하세요, 소프트웨어 개발자 김종하 입니다. 지금 연재하는 글은 "부트캠퍼를 위한 컴퓨터 과학" 입니다. 최근 소프트웨어 개발자 수요가 늘어나서 이를 공급하기 위한 코딩 부트캠프가 많이 csbooks.wisedog.net 웹 부트캠퍼를 위한 컴퓨터과학이라는 제목으로 김종하 개발자님이 작성중이신 자료인데요, 비전공자 분들을 위해서 전공자입장에서 최대한 쉽게 전공지식을 맛볼수있게 글을 작성해주신 느낌이 들었습니다. 사실 이렇게 쉽게 써주셨는데도 논리 회로부분과 네트워크 부분에서 몇몇 내용은 저는 아직 잘 이해가 안되는데 ㅜㅜ 지하철이나 버스에서 시간날때 .. 2021. 2. 28.
자바스크립트 object 내용 복습2 (2021-02-25) Udemy에서 ZTM 강의를 통해 React 를 사용한 앱 만들기 까지 맛보았으나 조금 더 JS에 대한 대한 깊은이해와 정리가 필요하다고 느껴져서 React 공식문서나 MDN 문서등을 보며 공부한 내용을 정리하려 합니다. 오브젝트 프로토타입(링크) 자바스크립트는 프로토타입기반 언어로 묘사되는데 그것은 오브젝트(객채)가 메소드와 속성(properties)를 상속받을 수 있는 템플렛 기능을 하는 prototype 오브젝트를 가질수 있다는 의미이다. 또한 객체의 프로토타입 객체 또한 프로토타입 객체를 지닐수 있다. 이렇게 쭉이어지는것을 prototype chain이라 한다. 객체에 상속되는 속성은 prototype으로 정의된 것들이다. 문자열을 만들고 . 으로 접근하면 수많은 활용가능한 메소드가 나오는 것도 .. 2021. 2. 25.
자바스크립트 object 내용 복습1 (2021-02-24) Udemy에서 ZTM 강의를 통해 React 를 사용한 앱 만들기 까지 맛보았으나 조금 더 JS에 대한 대한 깊은이해와 정리가 필요하다고 느껴져서 React 공식문서나 MDN 문서등을 보며 공부한 내용을 정리하려 합니다. reactjs.org/docs/hello-world.html 자바스크립트 복습 React공식문서에서는 자바스크립트를 어느정도 이해할것을 권장하며 링크에서 복습할것을 추천한다. 내가 잘 이해하지 못한 object에 대한 설명링크는 이쪽 this가 무엇인지에대한 링크 this keyword는 지난 강의에서 배웠듯 현재코드가 쓰여지는 object를 가리킨다. const person1 = { name: 'Chris', greeting: function() { alert('Hi! I\'m ' +.. 2021. 2. 24.