---------------------------------------------------------
* 생활코딩 WEBn 정독하기 project *
5. HTML 코딩과 실습환경 준비
LINK : https://opentutorials.org/course/3084/18448
----------------------------------------------------------
1. 코딩을 위해 필요한 것 :
웹브라우저 + HTML(컴퓨터, 사람도 이해할 수 있는 컴퓨터 언어. )를 작성할 프로그램. -> editor
- 내장되어있는 에디터 : window - 메모장, mac .. 등
- 각각 에디터들이 원래 코딩하기 위함은 아님.
- 코딩 전문적인 도구 사용할 것 -> 여기에서는 아톰 !
- 아톰 이외에도 원하는 것 있으면 따로 써도 됨. (필요한 편집기 찾아낼 수 있는 능력이 중요)
* 추천검색 키워드 : HTML editor / Best HTML editor 2020
2. ATOM 다운로드하기
1) https://atom.io/ 접속하여 다운로드
2) 패치 끝나면 실행, 창 떠있는 거 다 지우기
* 파란색 창 : register as default atom:// URI hanlder?
큰 고민 없이 Yes 누르면 된다. 위 메시지는 atom : //으로 프로토콜을 사용할 거냐고 물어보는 건데, http://으로 안 할 거냐고 물어보는 것. atom://라는 프로토콜은 크게 겹칠 것도 없으니 그냥 yes 눌러도 무관하다. ( 이후에 설정 변경 가능하니 용기 있게 Yes 누르기.!)
출처 : https://gocoder.tistory.com/1328
3. Atom에서 쓴 html 코드를 브라우저에 띄우기
1) 바탕화면에 'web'이라는 폴더 만들기
2) Atom 상에서 file - open folder - 방금 만든 'web' 들어가서 folder select
3) folder명 위에서 우클릭 - new file - '1.html'이라고 파일명 정하고 엔터
4) 브라우저 상에서 내 컴퓨터에 있는 html 파일 열기 : ctrl + O
* 보통 웹페이지를 열 때, 웹주소를 입력하는데 그것은 다른 컴퓨터에 있는 파일을 열 때임.
* 마이크로소프트 엣지에서는 위 기능 안됨. 크롬이나 익스플로러에서 하기
5) 방금 만든 1.html을 선택해서 연다.
6) Atom으로 돌아와서 Hello World 입력 후 저장 (Ctrl + S)
7) 브라우저로 돌아와서 새로고침 누르면 hello world 출력
'생활코딩 WEBn' 카테고리의 다른 글
[생활코딩_WEBn] HTML이 중요한 이유 (0) | 2020.09.02 |
---|---|
[생활코딩_WEBn] 줄바꿈 (0) | 2020.09.01 |
[생활코딩_WEBn] 통계에 기반한 학습 (0) | 2020.09.01 |
[생활코딩_WEBn] 혁명적인 변화 (0) | 2020.08.31 |
[생활코딩_WEBn] 기본 문법 - 태그 (0) | 2020.08.31 |