6월 28일, HTML/CSS 프로젝트 마지막날

📃 오늘 할 일 📃

 

• 코드 최종 수정
• Netlify 와 Github를 이용한 배포

---

🎈 개발 브랜치를 main 브랜치에 병합

 

main : 게임 돌아가는 서버
dev : 테스트 서버
개인브랜치 : 작업공간

 

이기 때문에 작업공간 ( 개인브랜치 ex. heeso-footer 등 ) 에서 만든것들을

테스트 서버 ( dev ) 에서 실행해보고 완료되면

게임 돌아가는 서버 ( main ) 에 최종적으로 업데이트를 해준다.

 

 

🔽 tailwind 로 보여주신 예시 🔽 + 우리는 input.css 가 없어서 merge 후 commit, push 만 해주었다

git switch main                  // 메인브랜치로 이동
git merge dev                    // 데브 브랜치 병합
ls                               // 확인 시 src 폴더 보임
cd src                           // src 폴더로 이동
ls                               // css 폴더 안에 input.css 와 output.css 가 있음
git rm css/input.css             // input.css 삭제
cd css                           // css 폴더로 이동
ls                               // output.css 만 존재
git status
git commit -m "input.css 삭제"   // 커밋
git push origin main             // main 브랜치에 push

배포할 때에는 개발 때 썼던 것들을 지우고 배포해야 하기 대문에

위의 명령어들로 input.css 와 output.css 가 존재할 때 input.css 를 지워보았다.

 

 

 

🎈 Netlify 와 Github 를 이용하여 배포하기

 

 

https://www.netlify.com/

Develop and deploy websites and apps in record time | Netlify

 

🌳 Github 로 Netlify 에 가입한다 ( 계정이 있다면 로그인한다 )

 

🌳 Add new site 클릭

Import an existing project : 가지고 오기
Start from a template : 템플릿부터 시작
Deploy manually : 로컬 컴퓨터에 있는 파일을 업로드

🌳 import an existing project 클릭

 

🌳 깃허브 선택 후 모든 레파지토리에 접근할 수 있는 권한 부여 : Authorize netlify

 

🌳 원하는 저장소 이름을 입력하고 : detective_2 클릭

 

🌳 배포 할 브랜치 선택 : main

 

🌳 Base Directory 에 src 작성 - 루트 디렉토리를 src 안에 넣어뒀기 때문

작성하지 않을 시에 main 브랜치가 root 로 인식됨

 

🌳 도메인 주소가 할당됨 : 바꾸고 싶으면 options - edit 후 수정

 

---

📃 작업 결과물 📃

 

 

 

🔽 깃허브 바로가기 🔽

 

https://github.com/h2s0/detective_2

GitHub - h2s0/detective_2: 멋쟁이 사자처럼 프론트엔드 스쿨 6기 프로젝트 2조 - 탐정 2조 작업 공간입

 

 

🔽 배포 홈페이지 바로가기 🔽

 

https://detective-karly.netlify.app/

Main