데굴데굴

⚙️ 오늘 배운 언어 HTML 🐹 오늘의 기분 웹개발을 한다면 기본으로 알고 있어야 하는 3대장 중 하나인 html을 배웠다. 아예 처음 접한 것은 아니었지만 독학할때부터 사이트의 구조를 짜는 것이 유독 어렵게 느껴졌어서 그 부분에 집중해서 학습했다. 아직 더 공부해야겠지만 전보다는 조금 눈이 떠진 기분이다. vscode prettier가 잘 적용되지 않는 것 같아서 불편했는데 오늘 그 부분도 고쳤다. 또 확장자별로 인덴트를 다르게 설정할 수 있는 법도 알아내서 바로 적용했다. 4로 설정하면 html, css, js 파일에서 가독성이 안 좋아지고, 그렇다고 싹 다 2로 설정하자니 알고리즘 풀 때 파이썬 파일의 가독성이 구려져서 불편했는데 방법을 찾아서 속시원하다! 오늘은 프론트엔드, 백엔드 과정 전부 모..

Hyemin's favorite (aemaaeng.github.io) 생활코딩 WEB1 - HTML 과정에서 실습으로 만들었던 사이트를 내가 좋아하는 것들로 채워보았다. 실습만 따라하다가 마지막에 다른 사람들이 가지각색으로 만들어둔 것을 보고 머리가 띵해졌다. "맞다. 난 뭘 만들기 위해 개발을 공부하는 건데 왜 내 방식대로 바꿔볼 생각을 못했지?" 대학교 마지막 기말고사를 치르고 이것저것 준비도 하고 공부도 하면서 잠깐 아주 잠깐 여유가 생겨서 그 틈에 수정해보았다. 깃허브 사용법도 잘 모르는 정말정말 배울 게 많은 나.... 열심히 해보자고

Day 9: 끝 공부 방향 웹사이트를 아름답게 하고 싶다 --> CSS 사용자와 상호작용하는 웹페이지를 만들고 싶다 --> JavaScript 백엔드 기술 이용: 변경사항을 한 번에 적용할 수 있다. Node.js, Django 등 여러 툴이 존재 이 중에 하나 골라서 배우면 된다. 재밌다. 일단 실습으로 만들었던 사이트부터 내가 좋아하는 내용으로 바꿔봐야지! HTML 문법에 충분히 익숙해지고 나서 다른 기술을 흡수해야 할 듯하다. 강의에서 말했던 것처럼 영어 문장 구조 배우고 나서 바로 논문 읽는 건 현실적으로 너무 힘드니까 지원서부터 마저 쓰고 바로 작업 들어가야지 아자자

Day 8: ~ 웹서버 운영까지 웹서버도 제품임. 여기서 쓸 소프트웨어는 Web Server for Chrome 파일찾기로 열었을 때 file://~~ 웹서버로 열었을 때 http://~~ http://뒤의 숫자는 internet protocol address, 흔히 말하는 IP 주소를 말함. IP 주소는 0.0.0.0부터 255.255.255.255까지의 주소가 존재 127.0.0.1은 내컴퓨터 자신을 가리키는 특별한 주소 Accessible on local network 옵션을 설정하면 같은 네트워크에 연결된 기기에서도 접속이 가능해진다. 아쉽게도 나는 이게 실행이 안 됐음ㅜ 내일은 수업 마무리 한꺼번에 듣고 바로 사이트 수정 들어가야겠다.

Day 7: ~ 웹호스팅까지 호스트 = 인터넷에 연결된 컴퓨터 하나 호스팅 = 컴퓨터를 빌려주는 사업 웹호스팅 = 웹서버를 전문적으로 빌려주는 것 github의 pages 기능 이용하기 HTML은 웹브라우저가 해석하기 때문에 서버에서 해줄 일이 없다. --> static HTML만으로 만들어진 웹사이트를 호스팅하는 서비스 중에는 무료가 많다. 나는 그냥 강의 예제 따라하는 걸로 구현했는데 자신만의 웹사이트로 만든 사람들이 많았다. 나도 내 관심사로 바꾼 후에 여기에 살짝 놓아봐야겠다!

Day 6: ~ 서버와 클라이언트까지 인터넷 동작의 기본원리 인터넷이 동작하기 위해 필요한 컴퓨터의 최소 개수는 2개 웹브라우저가 설치된 컴퓨터 & 웹서버가 설치된 컴퓨터 웹브라우저가 설치된 컴퓨터에서 주소를 입력하고 엔터를 누름 인터넷을 통해서 전기적인 신호를 보냄 주소에 설치된 웹서버라는 프로그램이 index.html이라는 파일을 찾음 그 내용을 읽어서 전기적인 신호로 바꾼 후 웹브라우저가 설치된 컴퓨터에 신호를 보냄. 웹브라우저가 설치된 컴퓨터에서는 index.html 파일의 코드가 도착함. 그럼 그 컴퓨터는 해당 코드를 읽어서 화면에 출력 client / server 갑과 을 공부는 익숙해지는 것. 이해는 익숙해지기 위한 방법 중 하나. 웹호스팅과 웹서버 1. 웹호스팅은 비교적 간단하지만 많은 것..

Day 4: ~태그의 제왕까지 부모, 자식 태그 opentutorials 여기서는 a 태그가 p 태그의 자식, p 태그는 a 태그의 부모 p 태그가 꼭 a 태그의 부모여야 하는 것은 아니며, 그 반대 또한 마찬가지이다. 하지만, 부모자식이 고정된 관계인 태그가 있음. 목록 li 태그와 ul 태그의 관계가 그러함. 목록은 다른 목록과 구분할 수 있도록 경계 태그가 필요함. 부모: ul (unorderd list), 자식:li(list) 1. HTML 2. CSS 3. JavaScript egoing k8805 sorialgi 자동으로 번호를 매겨주는 태그는 ol (ordered list) 구조 만들기 문서의 타입 설명, doctype 입력은 대문자로 해도 되고 소문자로 해도 됨. 저장방식 지정, 문자 깨짐..

Day 3: ~최후의 문법 속성과 img까지 Q. 줄바꿈은 어떻게 할까? Google 'html new line tag' 검색 - To add a line break to your HTML code, you use the tag. The tag does not have an end tag. You can also add additional lines between paragraphs by using the tags. 무언가를 설명하지 않는 태그들은 감싸야하는 컨텐츠가 없기 때문에 태그를 닫지 않음. ex) img, input, br, hr, meta 단락표현태그 p - The tag defines a paragraph. Browsers automatically add a single blank line ..