분류 전체보기

네이버, 유튜브, 페이스북 등등 우리는 많은 웹페이지를 본다. 하지만 일반적인 사람들 관점에서는 그냥 별 생각없이 웹페이지를 이용한다. 프론트엔드 공부를 시작하면서 중요했던건 자주 사용하는 웹페이지를 보더라도 그냥 지나치는 것이 아닌, HTML 골격구조는 어떻게 구성되어 있고, 어떤 CSS 기법이 쓰였는지 분석해보는게 정말 중요한 것 같다. 그래서 엄~~청 자주 사용하는 네이버 메인 페이지를 분석해보았다. (※참고, 몇 개월 전에 공부할때 해본 것이며, 정확한 정답은 아닙니다!) 파란색 박스 : body 초록색 박스 : header (헤더 안에 네이버로고, 검색창, 검색버튼, '네이버를 시작페이지로', '쥬니어 네이버', '해피빈' 등의 로고가 있다.) 빨간색 박스 : 사이드바 (사이드바에도 엄청 많은 ..

사실 프론트엔드 부분은 몇개월전 부터 공부를 시작했다. microsoft의 ONE NOTE라는 전자필기장으로 혼자 공부하며 필기했었는데, 다른 사람들과도 공유하면 싱크(?)가 안맞고 필기했던게 다 꼬인다. 이번에 개발 블로그를 시작했으니 지금까지 필기하고 공부했던 부분을 여기다가 복습도 할 겸 다시 포스팅하기로 했다. 1. HTML 이란? HTML : Hyper Text Markup Language의 약자 HTML은 브라우저에서 실행 가능한 가장 기본적인 파일, HTML은 Markup언어로 구조적으로 이루어져있다. Html 의 기본적인 구조 --> 도큐먼트 타입은 html이라고 정의 --> 사용자에게 보여지는 최소한의 컴포넌트 UI (유저에게 보여지는 부분) Heading1 --> 제일 큰 태그 Head..

장고로 서버까지 열 수 있게되었고, Visual Studio Code에 연동까지 했으니 쪼금 응용해보았다. 자신이 직접 열었던 서버에 원하는 텍스트를 출력해보았다. 먼저 장고 서버가 잘 작동하는지 먼저 확인하고, 시작한다. 1. 텍스트 출력을 위해 '앱' 만들기 앱(app)을 사용하여 원하는 화면을 출력할 수 있다. 먼저 앱을 만들기 위해서는 cmd창에서 manage.py가 있는 디렉토리에서 python manage.py startapp 원하는 디렉토리 명 명령어를 입력해준다. 성공적으로 명령을 수행했다면 Visual Studio Code에 들어가보면 왼쪽에 본인이 설정해놓은 디렉토리가 하나 생겼을 것이다. (cmd에서도 dir 명령어를 통해서 확인할 수 있음.) 2. 원하는 텍스트를 입력하기 Visua..

저번 포스트에서 장고 설치와 환경설치까지 해보았다. 필자가 사용하는 코드 에디터는 vusual studio code 인데, 앞으로 개발을 여기에 할 것 같아서 장고를 visual studio code에 연동 시켜보기로 했다. 첫번째로 저번 포스트에서 처럼 가상환경을 실행시켜준다. 실행 방법은 저번 포스트 참고! 그 다음 장고를 실행시켜준다. 명령어는 django-admin startproject 원하는 디렉토리명 이 명령어를 실행해준다. 성공적으로 실행됐다면 아무런 반응도 없다. 그리고 다시 dir 명령어를 사용해 디렉토리가 성공적으로 만들어 졌는지 확인한다. 방금 만든 디렉토리가 있다면 성공한 것이다. 다시한번 dir을 사용해서 방금 만든 디렉토리에 들어가보면 manage.py와 같은 이름의 디렉토리가..