두시간동안 간단한 웹(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기
  • 블로그 메뉴

    • 홈
    • 태그
  • 링크

  • 공지사항

  • 인기 글

  • 태그

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

  • 최근 글

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

티스토리툴바