본문 바로가기
Study(매일매일한걸음씩)/Web(html,css,js)

[firebase]를 이용하여 web 호스팅 하기(초간단)

by 여유러운백수삶개발자 2023. 10. 17.

1. firebase 로그인(구글 아이디)

https://firebase.google.com/?hl=ko 

 

Firebase | Google’s Mobile and Web App Development Platform

개발자가 사용자가 좋아할 만한 앱과 게임을 빌드하도록 지원하는 Google의 모바일 및 웹 앱 개발 플랫폼인 Firebase에 대해 알아보세요.

firebase.google.com


 

 

2. 프로젝트 만들기


3. HOSTING 추가


4. VSC 실행(폴더 만들어서 진행)


5. GIT INIT(github)(repository 만들어서 github 사용해서 관리 할 수 있음)


6. firebase 관련 설치 및 배포

// firebase 설치, npm은 nodejs 설치해야지 됨

npm install -g firebase-tools 

// 초기화

firebase init

// 로그인
firebase login

// 배포
firebase deploy

8. 확인(아무것도 안했을때 화면임)


9. 수정 후 다시 확인- 내용 수정하고 "firebase deploy" 하면됨(git hub 할려명 push하면됨)

<body>
    <div id="message">
      hi my name is carcase2
    </div>
    <p id="load">Firebase SDK Loading&hellip;</p>

 


하면서 발생 할 수 있는 문제점

  1. npm 실행이 안됨
    1. nodejs가 설치가 안했을 경우
      1. https://nodejs.org/ko에서 설치
    2. 환경변수 추가해서 해결
      1. 구글 검색하면 됨
    3. powershell 모드일 경우
      1. cmd 로 전환해서 실행
  2. index.html 파일이 안보일때
    1.  
    2. public 폴더안에 있음
  3. firebase 초기화/설치/배포시 문제 발생
    1. hosting을 추가 하지 않았을때(시작하기 하지 않았을 경우)
  4. 어디로 접속해야 될지 모를때
    1. firebase deploy 실행하면 아래에 표시된다. (ctrl+클릭) 
    2. https://testweb-e41d0.web.app 누르면 됨

 

댓글