[HTML] 0. 블로그 만들기.

시작한지 얼마 안됐기에

 

블로그 시작하면서 이거저것 검색을 했지요.

 

여러가지 블로그들을 방문하면서

 

!!!

'우왕 이쁘다 나도 저렇게 만들어야지.'

 

라는 생각이 머릿속을 스쳐 지나갔지 뭐에요

 

제가 이래뵈도

 

컴공과를 졸업 했기에

 

아주 예전 기억 저편 넘어에

 

웹페이지를 살짝 살짝 만들었던 기억이

 

있더라구요...!

 

요런 과제도 해보고

대학교 시절 생각이 나면서

 

없던 창작 욕구가 뿜뿜 해서

 

시작해볼까 합니다...!

---

1. 작업 환경 셋팅

 

• 사용하는 브라우저 : 구글 Chrome
• 사용하는 프로그램 : Sublime Text
• 참고 교제 : Hello Coding HTML5+CSS5

크롬 브라우저 설치 - https://www.google.com/intl/ko_kr/chrome/

Chrome 웹브라우저

Sublime Text 설치 - https://www.sublimetext.com/3

Download - Sublime Text

 

2. 서브라임 텍스트 환경 셋팅

 

예전애 해당 프로그램을 바탕으로 작업을 했던 기억이 있네요

 

분명 자동완성으로 촵촵 써 내려갔는데

 

이게 무슨일이야. 자동완성 기능이 없네요

 

찾아보니 몇가지 셋팅을 해야 한다니 차근차근 따라 해보도록 하겠습니당

 

  1) 위 사이트 접속 후 알맞은 OS 경로로 설치

  2) 설치 프로그램 실행 후 설치

특정 설치 프로그램은 생각없이 누르면 얘가 데려온 친구들도 같이 설치 돼서 골치 아프기도 함

  3) EMMET 설치 진행

   

해당 메뉴 안에 'Package Control' 야 하는데 없음 귀찮다 귀찮아

https://packagecontrol.io/installation#st3 < 요기 접속해서 다운로드 진행

Perferences > Browse Packages... 클릭

폴더가 하나 열릴텐데 한단계 상위폴더로 나와주시면 됩니당

Installed Packages 입장~

 다운 받았던 Package Control.sublime-package 파일 이동

모자이크는 선택아닌 필수!

서브라임 텍스트 재시작했을 때 Package Control 메뉴가 생성됐으면 성공

해당 메뉴 클릭 또는 단축키 (Ctrl + Shift + P) 누르기

단축키 자주 쓰일 듯 하니 외울래

영하고 MZ하게 줄임말로 'PCIP' 입력 후 클릭

누르면 아무런 반응이 없다. 그렇다. 설치가 자연스럽게 완료 된 것이다.

이후 다시 창을 열어 'emmet' 설치

이친구는 설치하면 텍스트 창 하나가 출력된다. 녀석 참 친절하다.

  4) 테스트를 해보자.

새 창을 열어서 파일명 '테스트.html' 로 저장

앞으로 수백번은 보게될 화면이다 친하게 진해자

해당 창에 !(느낌표) 입력 후 탭키를 누른다.

처음 해당 기능을 사용한 기분을 표현하기 위해 느낌표를 쓰라는 것 같다. 정말 탭키 누르는 순간 !!! 하는 느낌쓰

여기까지 넘넘 잘했다구!

---

이제 준비는 다 끝났네요!

 

앞으로 교제 내용 바탕으로

 

천천히 진행 해보도록 하겠습니다.

 

히히 재밌겠다.