예제1

$$config title: 테일윈드3를 VS CODE와 함께 사용하기 keywords: - 테일윈드3를 VS CODE와 함께 사용하기 $$ # 개요 - 주소 : [https://slog.gg/p/6522](https://slog.gg/p/6522) - 테일윈드3를 VS CODE와 함께 사용하기 # 관련링크 - [테일윈드3 - slog.gg/p/6304](https://slog.gg/p/6304) - [CODEPEN](https://codepen.io/pen) # 강의 ## 1강 - [영상 - 22 05 31, ken 6522, 1강, 테일윈드3를 VS CODE와 함께 사용하기 강좌의 개요](https://youtu.be/HNFTDOjzoJA) ## 2강 - [영상 - 22 05 31, ken 6522, 2강, nodejs 설치](https://youtu.be/RwTtMaOen2c) ## nodejs가 이미 설치되어 있는지 확인하는 방법 - 윈도우 키, cmd 엔터 - cmd 진입 - node -v - 여기서 버전이 출력되면 이미 설치가 된겁니다. ## nodejs 설치 - [nodejs 다운로드 - nodejs.org/ko/](https://nodejs.org/ko/) - LTS 버전을 다운로드 후 설치해주세요. - [GIT 다운로드 - git-scm.com/](https://git-scm.com/) - GIT도 설치해주세요. - GIT 설치 후 GIT 세팅 명령어(1회만 입력) - 윈도우 : git config --global core.autocrlf true - 윈도우 : git config --global core.ignorecase false - MAC : git config --global core.autocrlf input ## 3강 - [영상 - 22 05 31, ken 6522, 3강, vscode 설치](https://youtu.be/4t4-25EUzN8) ## vscode 설치 - [vscode 다운로드 - code.visualstudio.com](https://code.visualstudio.com/) ## 4강 - [영상 - 22 05 31, ken 6522, 4강, VS CODE 설치 및 세팅법 강좌, slog.gg/p/3600 소개](https://youtu.be/4iEf1Uzgv3E) - [VS CODE 설치 및 세팅법 - slog.gg/p/3600](https://slog.gg/p/3600) ## 5강 - [영상 - 22 05 31, ken 6522, 5강, VS CODE로 프로젝트 여는 방법](https://youtu.be/Eil_iVNZD_o) ## 6강 - [영상 - 22 05 31, ken 6522, 6강, 코드펜에서 작업한 내용을 VS CODE에서 실행하는 방법](https://youtu.be/zb6Yde_o4Hk) ```html 예제1

``` ```css @font-face { font-family: "GmarketSansMedium"; src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff") format("woff"); font-weight: normal; font-style: normal; } html > body { font-family: "GmarketSansMedium"; text-underline-position: under; } ``` ## 7강 - [영상 - 22 05 31, ken 6522, 7강, 테일윈드 CLI 적용](https://youtu.be/Rn7yOOR3P1s) - [테일윈드 CLI 설치 및 사용법 - tailwindcss.com/docs/installation](https://tailwindcss.com/docs/installation) ### 테일윈드 프로세스 시작 - VSCODE 터미널 진입 : `Ctrl + ~` 로 터미널 창 토글 - npx tailwindcss -i ./src/input.css -o ./src/output.css --watch - 테일윈드 프로세스 시작 - 종료는 `Ctrl + C` - 다시 시작하는 방향키 `↑` 입력 후 다시 엔터 - 방향키 `↑`를 누를때마다 기존에 입력했던 명령어들이 하나씩 나옵니다. ## 8강 - [영상 - 22 05 31, ken 6522, 8강, 작업할 때 마다 테일윈드 프로세스를 켜야 합니다.](https://youtu.be/alisW4L24rI) - [리포지터리 - github.com/jhs512/tailwind_exam_2022_05_31](https://github.com/jhs512/tailwind_exam_2022_05_31) - [GIT](https://github.com/jhs512/tailwind_exam_2022_05_31/commit/1d5edf90123e16220cc4f418aa1aed7d82ac1a96)

게시글 상세