내가 궁금해서

api연결 강의 들으면서 할 때나 누가 해논거 보고 따라 할 때는 어렵다고 안 느꼈는데 첨부터 혼자 할라니까 넘나 어렵다.... 그래서 공공데이터포털에서 한번 연결해 보려고 한다 일단 공공데이터포털에 들어가 로그인을 한닷! https://www.data.go.kr/tcs/eds/selectCoreDataListView.do 공공데이터 포털 국가에서 보유하고 있는 다양한 데이터를『공공데이터의 제공 및 이용 활성화에 관한 법률(제11956호)』에 따라 개방하여 국민들이 보다 쉽고 용이하게 공유•활용할 수 있도록 공공데이터(Datase www.data.go.kr 공공데이터를 활용한 예제도 볼 수 있다 https://www.data.go.kr/tcs/puc/selectPublicUseCaseListView.do..

https://designbase.co.kr/magazine/uxui-design-reference-website/ UXUI 디자인 참고하기 좋은 웹사이트 모음 오늘은 모바일 앱 UXUI 디자인을 참고하기 좋은 사이트를 소개해 드릴게요. Collect ui Collect ui는 카테고리별로 상세하게 분류되어 있어 참고하려는 페이지와 비슷한 디자인을 찾기 편합니다.http://c designbase.co.kr https://www.siteinspire.com/ Siteinspire | Web Design Inspiration www.siteinspire.com https://bm.s5-style.com/ ハイクオリティなWebサイトを探すなら Webデザインギャラリー | S5-Style ハイクオリティなWebサイ..

API어렵따,,,! fetch해서 데이터가져와서 뿌리기!!! 가 프론트엔드의 기초 이지만 설명해보시오 하면 오잉ㅇㅣ다 REST API를 알아보기전에 API의 대해서먼저 알아봐야할 필요가 있다.. 🏔️API란 Application Programming interface(애플리케이션 프로그램 인터페이스)의 줄임말이다 비유해보자면 식당에서 점원이 준 메뉴를보고 주문을 하면, 점원이 주문을 받아 요리사에게 전달한다 요리사는 요리를만들고 점원에게 주고 점원은 손님에게 요리를서빙한다 이처럼 API는 식당의 점원과 같은 역할을 한다. 여기서 손님과 요리사는 프로그램! API는 프로그램들이 서로 상호작용하는 것을 도와주는 매개체이다. 🏔️REST란 REST(Representational State Transfer)의 ..

코드를 짜다보면 e.preventDefault()를 사용할때가 많다 하지만 이유는 모름 다들 사용하니까 그냥 사용하는 느낌....그래서 갑자기 왜 사용하는지 궁금해져서 알아봤다 a 태그나 submit 태그 같은 경우 클릭하면 href를 통해 이동하거나 새로고침하여 페이지가 열리게 되는데 preventDefault를 사용하면 위와같은 경우를 막아줄수가 있다...! 1. a태그를 눌렀을때에도 링크로 이동하지 않게 하고싶은 경우 2. form 안에 submit 역활을 하는 버튼을 눌러도 새로고침을 하고싶지 않은 경우 2의 경우 예시 constructor(props){ super(props); this.state = { first: Math.ceil(Math.random() * 9), second: Math.c..

🖍️router란 경로에 맞는 페이지를 보여준다 ~~더알아보기~~ ✔️react-router를 사용하는 이유 주요로직과 라우팅처리 분리 '동적라우팅', '중첩라우팅' 등을 쉽게 관리 ✔️react-router를 사용할때 기억해야할 3가지 , , BrowserRouter: 브라우저에 내장되어있는 히스토리스택을 사용해 라우팅을 구현하게 해주는 컴포넌트 Routes: Route: Routes에 감싸지 않으면 에러가 난다 App.js에 사용하는 고정된 사용 방법이다 function App() { retrun ( ) } Route 안에는 path 와 element가 있는데 path는 주소창에 들어갈 주소를 적으면 되고 element는 해당 주소에서 보여줄 컴포넌트를 넣어주면 된다. ✔️useParams() key..

아직 개념이 확실하지않아서 매우매우 헷깔리는중.. 그냥아무거나 갖다붙이는거같아서 제대로알아보려고한다 (문과식으로 이해하도록하는걸로..! 주절주절 넘어려운말이 많음..) 📍프레임워크란? frame은 "틀", work은 "일하다"라는 뜻이다. 두가지의 의미를 합치면 틀을 가지고 일하다 가 된다. 예를들면 Vue에서 우리는 v-bind, v-for 등의 틀을 가지고 작업을한다. 프로그램 개발을 하기위해 사용되는 틀을 제공하는 프로그램! 이라고 보면된다 ⭕️프레임워크의장점 효율적이다 기본적인 틀이 존재하기에 시간도 절약이 되며 훨씬 더 빨리 만들수있다. 유지보수가 쉽다. 하나하나 개개인이 짜놓았던 코드라면 다른사람이 볼 경우 알기 어렵지만 프레임워크를 사용한 코드라면 체계적이기 때문에 다른사람이 만든것이라도 알..

스택(Stack)이란? 스택이란 "쌓다"라는 의미로 데이터를 차곡차곡 쌓아 올린 이미지다 데이터가 순서대로 쌓이고 가장 마지막에 삽입된 자료가 가장 먼저 삭제되는 구조! 비스캣과자를 꺼낼때 가장아래의 과자를 꺼내려면 위에서부터 차례대로 꺼내야하는것처럼 가장 위쪽(최신)의 데이터부터 꺼낼수 있으며 이러한 스택의 구조를 후입선출이라고한다 스택(Stack)의 사용 사례 웹 브라우저 방문기록 (뒤로가기) ⇒ 가장 마지막에 열린 페이지부터 다시 보여준다 실행취소(undo) ⇒ 가장마지막에 실행된 것부터 실행을 취소해준다 역순 문자열만들기 ⇒ 가장 마지막에 입력된 문자부터 출력한다 후위 표기법 계산 장단점 top을 통해 접근하기 떄문에 데이터 접근, 삽입,삭제가 빠르다 top 위치 이외의 데이터에 접근할 수 없어 ..

리스트란 순서대로 줄이 서있는 데이터라고 한다. Array 배열 인덱스가 존재한다 메모리 주소가 연속적이다. 메모리부터 데이터를 가져오는게 빠르다 List 리스트 인덱스는 존재하지만 (앞에서 부터 ~ 순서만 지정을해준다) 메모리주소가 연속적이지 않을 수 있다 메모리부터 데이터를 가지고 오는게 어렵다 Array List & Linked List Array List Default List Type (val = [1, 2, 3, 4] // Array List) 내장함수 : insert(), ... extend(a): 리스트에 객체를 추가 li = [1,2,3,4,5] subli = [6,7] print('+' , li + [6,7]) // 새로운 오브젝트를 만듬 #EXTEND li.extend(subli) p..

패럴랙스안건에 넘나좋은 플러그인 발견 예시사이트에 찾은 플러그인 ,,오엠지 감사합니다,, 덕분에 머리깨질일은 없네영 찾아보니까 한국에서는 잘 안쓰는? 안유명한가보다,, 다들 그냥 바닐라로 만든느거겟지,, 난아직 익숙하지않아서,,,,,,모테!!!! https://min30327.github.io/luxy.js/ Luxy.js｜Inertia scroll and parallax effect plugin in Vanilla.js Usage Wrap the entire content with the element specified in the wrapper option. Please exclude fixed elements. ... Entire content Add .luxy-el to the element fo..

방글라아조씨가 리액트 못써서 자기는 solidjs 쓴다고 알려줘따 아저씨 개발신인데 왜 리액트 안 쓰는거야,,, 아조씨가 리액트만썼었어도,,내가 안그만둬써,,(우소데스) solid js란React 에서 사용하는 JSX 문법을 사용하며, 가장 빠른 성능과 가장 정확한 반응성을 강점으로 내세우고 있다. 나온지 얼마 안 됐음에도 벌써 Cloudflare, Netify 등 주요 클라우드 업체에서 주목받고 사용하는 웹 프레임워크이다. 21년도에 출시된 아주 땃끈한 프레임워크이다 리액트랑 엄청나게 비슷하게 나와서 첨에 코드보고 리액트? 했음 React 앱의 스크립트 읽기 속도 475ms, 렌더링 속도 129ms, 배포 번들 크기는 핵심과 앱 순으로 각 161KB, 5KB SolidJS 앱의 스크립트 읽기 속도 17..