포트폴리오 제작을 완료한 후 실제 볼 수 있는 사이트를 만들기 위해 여러 방법들을 알아보았다. 그 중에서 포트폴리오 같은 정적파일을 깃허브에 올리고 자체적으로 사이트를 만들 수 있는 방법이 있어 까먹지 않기 위해 글을 쓴다. 1. 우선 깃허브에 포트폴리오 레포지토리를 올려놓아야한다. (레포지토리 생성 방법은 생략) 2. 해당 repository-settings- github pages - source 나는 이미 설정을 해두었지만 source에 있는 branch를 main으로 설정해준 후 save해준다. 그러면 아래 이미지 처럼 초록색 메세지창? 에 링크가 뜬다. 3. 다시 레포지토리로 돌아와서 우측에 enviroment 클릭 4. view deployment하면 해당 페이지가 나온다. 이렇게만 해도 거의..
1. 복사한 주소를 postman에 붙여주기. 우선 아래의 사진처럼 +버튼을 눌러 페이지 추가해준다. 그 후 get방식으로 복사한 api주소 붙여넣기 해준다. 2. q의 value에는 원하는도시이름 apiid의 value에는 받아온 apikey값을 넣어준다. apiKey값은 open api사이트에서 마이페이지 -> MY api Keys 에서 받을 수 있다. 해당 값들을 입력한 후 send버튼을 누르면 JSON형태로된 데이터가 출력되는 것을 볼 수 있다.
https://openweathermap.org/current Current weather data - OpenWeatherMap Access current weather data for any location on Earth including over 200,000 cities! We collect and process weather data from different sources such as global and local weather models, satellites, radars and a vast network of weather stations. Data is avai openweathermap.org vue3 기반으로 하는 날씨 어플리케이션을 만들어보자 api는 위의 링크에서 받아왔다. ..
📌이벤트 핸들러 사용자가 웹 페이지의 HTML과 상호작용할 때 이벤트를 핸들링하도록 프로그래밍 할 수 있다. 이벤트 핸들링하는 방법에는 크게 3가지가 있다. 1.HTML 이벤트 핸들러 2. 전통적인 DOM 이벤트 핸들러 3.이벤트리스너 📌이벤트 리스너(Event Listner) 그러나 1,2번의 방법의 경우 잘 사요되지 않고, 3번의 방법으로 가장 많이 이벤트를 바인딩한다. 따라서 이 글에서는 3번째 방법만 소개를 하겠다. 👉이벤트 리스너(Event Listener) 활용 function onAddStationHandler() { // 이벤트 처리 로직을 구현한다. } // 지하철 역 추가 버튼의 요소를 가져온다. const $stationAddButton = document.querySelector("..
📌Event를 알아야 하는 이유 1. input창에 값을 입력하고,엔터를 쳤을 때 지하철역을 리스트에 추가하고 싶다면? 2.삭제 버튼을 눌렀을 때 지하철 역을 삭제하고 싶다면? 3.인터렉티브한 사용자 경험을 만들고 싶다면? 위와 같은 이벤트를 유연하게 처리하게 위해서 우리는 반드시 이벤트를 알아야 한다. 동적인 웹은 사용자와 상호작용이 잘 되어야 한다. 그리고 그 상호작용은 어떤 이벤트에 의해 발생한다. 그래서 프론트엔드에서 많은 인터렉션은 모두 Event를 처리하는 것과 깊은 관련이 있다. 📌이 문서를 통해 얻어갈 것 📧이벤트 종류를 최소 3가지 이상 말할 수 있다. 📧DOM Element에 이벤트를 바인딩할 수 있다. 📧이벤트의 흐름을 제어할 수 있다 📧이벤트 종류를 최소 3가지 이상 말할 수 있다...
- Total
- Today
- Yesterday
- 알고리즘
- 디바운싱
- useState
- Repository pattern
- 이벤트리스너
- focus와blur
- vue.js3
- Vuex
- store.js
- react
- loadbalancer
- Http통신
- http
- 항해솔직후기
- 항해플러스후기
- vue3
- eventListner
- React18v
- 항해플러스프론트엔드
- Vue.js
- event종류
- 더미데이터
- reactnative
- 레포지토리패턴
- 이벤트버스
- JWT토큰
- 웹훅
- props
- 로그인 인증
- 빅오표기법
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |