두시간동안 간단한 웹(Web) 개발하는 법(배포)🔥 - 2

2023. 1. 19. 19:16·Web

개요

  • netlify로 사이트 등록하기
  • 결과

netlify를 등록하는 것은 어떤 건가요?

Fig. 1. netlify

  • 지난 포스팅까지의 내용은 쉽게 말해 웹페이지를 만들었지만, 다른 누군가에게 내가 만든 웹사이트를 보여주려 한다면, index파일이 저장되어 있는 내 컴퓨터를 직접 가지고 가서 보여줘야 하는 상태입니다 Fig. 1
  • 그래서 내 컴퓨터에 저장된 파일을 백앤드 서버에 올려주면 링크를 제공받고 다른 사람들이 웹사이트에 접속을 할 수 있는 데, netlify가 그 역할을 수행해줍니다

netlify로 등록하기

Fig. 2. netlify 접속

  • account가 따로 존재하지 않으신다면, 회원가입을 해야 하는 데, 저는 GitHub계정을 가지고 있어서 GitHub로 로그인했습니다. 어렵지 않아서 먼저 회원가입 해주시면 됩니다 Fig. 2

Fig. 3. Deploys

  • Fig. 3 Site overview옆에 Deploys 창으로 들어가 주시면 됩니다

Fig. 4. Deploys 페이지

  • 들어가시면 위와 같은 창이 Fig. 4 나오는 데,

Fig. 5. Upload

  • Fig. 5 위와 같이 html파일을 드래그 해서 netlify홈페이지에 올려놓으면 자동으로 업로드됩니다

Fig. 6. Published

  • Fig. 6 왼쪽 하단부에 Published라고 표시된다면 성공입니다

Fig. 7. 웹 주소


결과

Fig. 8. 링크gif

  • 위에 Fig. 8 gif와 같이 링크를 클릭하면 여러분이 만든 홈페이지로 접속을 할 수 있고, 친구한테 링크를 보내서 구경시킬 수 있습니다!

참조

https://traceofpassion.github.io/2020/blog-making-03/#:~:text=Netlify%EB%8A%94%20%EC%A0%95%EC%A0%81%20%EC%82%AC%EC%9D%B4%ED%8A%B8%EC%9D%98,%ED%9A%8C%EC%9B%90%EA%B0%80%EC%9E%85%EC%9D%84%20%EB%A7%88%EC%B9%A9%EB%8B%88%EB%8B%A4.

 

R로 블로그 만들기(3) - Netlify로 사이트 배포하기

제작한 블로그를 사람들이 인터넷 상에서 볼 수 있도록 배포해주는 Netlify를 소개합니다.

traceofpassion.github.io

 

저작자표시 비영리 변경금지 (새창열림)
'Web' 카테고리의 다른 글
  • 두시간동안 간단한 웹(Web) 개발하는 법🔥 - 1
Jelong
Jelong
커스텀 웹: https://jaehong-park.com Github: https://github.com/qkrwoghd04
  • Jelong
    24/7 Developer's Note
    Jelong
  • 전체
    오늘
    어제
    • 분류 전체보기
      • Software Engineering
      • Ubuntu
      • Network
      • JavaScript
      • Web
      • Interaction Design
      • React Native
      • React
      • Algorithm
      • Java
      • Database design
      • IT Trend
      • TroubleShooting
      • AWS
      • Interview
      • LG CNS AM CAMP 1기
  • 블로그 메뉴

    • 홈
    • 태그
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    AWS
    이진트리
    html
    javascript
    데이터 구조
    블랙 박스 테스트
    자바스크립트
    css
    prototyping
    heap
    소프트웨어 공학
    GPT-4
    ChatGPT
    frontend
    알고리즘 분석
    JS
    BST
    오블완
    Queues
    mininet
    화이트 박스 테스트
    자바
    generic
    알고리즘
    typescript
    expo
    java
    미니넷
    React
    티스토리챌린지
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.1
Jelong
두시간동안 간단한 웹(Web) 개발하는 법(배포)🔥 - 2
상단으로

티스토리툴바