일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- Beesbeesbees
- js
- 노드교과서
- https://www.daleseo.com/js-array-slice-splice/
- variable#function
- slice/splice/split
- cmarket
- dom
- redux상태유지
- 자바스크립트#JS#var#let#const#undefined#null
- User Flow
- toString#String
- for~in/for~of
- https://lo-victoria.com/introduction-to-redux-toolkit-for-beginners
- JS#3일차달리자#초반인데#시간금방~
- children vs childrenNodes
- removeCookie
- @redux-toolkit
- 내장고차함수
- 자바스크립트
- UI
- react
- UX
- ㄷㅌ
- CSS
- https://developer-talk.tistory.com/299
- https://dasima.xyz/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EC%A0%9C%EA%B3%B1-math-pow-%EA%B3%84%EC%82%B0/
- 헷갈린다~
- 자바스크립트#조건문#문자열
- 자바스크립트#JS#slice#splice
- Today
- Total
목록Code개발일지 (103)
Daily Front_Minhhk
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/bmJP6Y/btrSVISBM2g/R3oZzaTE2xzGVRKPCwTzEK/img.png)
Postman API Platform | Sign Up for Free Postman is an API platform for building and using APIs. Postman simplifies each step of the API lifecycle and streamlines collaboration so you can create better APIs—faster. www.postman.com Сurrent weather and forecast - OpenWeatherMap Access current weather data for any location on Earth including over 200,000 cities! The data is frequently updated based ..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/YLatC/btrSE8cZAhW/ZSOTR0xK8KMwcYuATtQ7Sk/img.png)
REST API는 무엇인가? REST API는 REST를 기반으로 만들어진 API로 웹에서 사용되는 데이터나 자원(Resource)을 HTTP URI로 표현하고, HTTP 프로토콜을 통해 요청과 응답을 정의하는 방식을 말한다. REST는 "Representational State Transfer"의 약자로, 로이필딩)의 박사학위 논문에서 웹(http)의 장점을 최대한 활용할 수 있는 아키텍처로써 처음 소개되었다. 네트워크에서 HTTP 프로토콜을 기반으로 요청과 응답에 따라 리소스를 주고받기 위해서는 알아보기 쉽고 잘 작성된 메뉴판이 필요한데, 이 역할을 API가 수행해야 하므로 REST API를 잘 디자인 하는 것이 중요하다. REST 성숙도 모델 - 0단계 REST 성숙도 모델에 따르면, 0단계에서는 ..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/EJ22q/btrSwsqkI5A/uPnNyxVngwMGmmmq9bDFFK/img.png)
웹 애플리케이션 아키텍처 학습목표 클라이언트-서버 아키텍처를 이해할 수 있다. HTTP를 이용한 클라이언트-서버 통신을 이해할 수 있다. API의 개념을 이해할 수 있다. 개념학습) 웹 애플리케이션 아키텍처 클라이언트-서버 아키텍처 상품 정보 같은 리소스가 존재하는 곳과 리소스를 사용하는 앱을 분리시킨 것을 2티어 아키텍처, 또는 클라이언트-서버 아키텍처라고 부른다. 리소스를 사용하는 앱이 바로 '클라이언트', 리소스를 제공(serve)하는 곳은 '서버'라고 부른다. 3-Tier 아키텍처 서버는 리소스를 전달해 줄 뿐, 리소스를 저장하는 공간은 데이터베이스라는 창고에 둔다. 이처럼, 기존 2티어 아키텍처에 데이터베이스가 추가된 형태를 3티어 아키텍처라고 부른다. 프론트엔드와 백엔드 프론트엔드 혹은 벡엔드..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/v8WLf/btrSrm4nhe1/WNK2aZ226XJT19357swEN0/img.png)
학습 목표 state, props의 개념에 대해서 이해하고, 실제 프로젝트에 바르게 적용할 수 있다. React 함수 컴포넌트(React Function Component)에서 state hook을 이용하여 state를 정의 및 변경할 수 있다. React 컴포넌트(React Component)에 props를 전달할 수 있다. 이벤트 핸들러 함수를 만들고 React에서 이용할 수 있다. 실제 웹 애플리케이션의 컴포넌트를 보고 어떤 데이터가 state이고 props에 적합한지 판단할 수 있다. 실제 웹 애플리케이션 개발 시 적합한 state와 props의 위치를 스스로 정할 수 있다. React의 단방향 데이터 흐름(One-way data flow)에 대해 자신의 언어로 설명할 수 있다. 🔑 Props P..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/PXqOs/btrSlVEV0bg/k7R3AI0t9Xk7N1djexKTAK/img.png)
학습 목표 SPA(Single-Page Application) 개념을 이해하고 설명할 수 있다. SPA의 장, 단점에 대해 이해하고 설명할 수 있다. 와이어프레임을 보고 어느 부분을 컴포넌트로 구분할지 스스로 정할 수 있다. React에서 npm으로 React Router를 설치(npm install react-router-dom@6.3.0)하고 이용할 수 있다. React Router를 이용하여 SPA를 구현할 수 있다. 라우팅 구조를 짤 수 있어야 하고, 이에 필요한 기초 문법들을 사용할 수 있어야 한다. [ React SPA ] → Single-Page Application SPA의 등장 배경과 개념 전통적인 웹사이트는 페이지 이동 시 매번 '페이지 전체'를 불러와야 했다. 하지만 SPA는 업데이트..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/Adwe8/btrSa7ZRUWA/uyuDFbMNVE1maQdbGNsvR1/img.png)
리액트의 3가지 특징 선언형 컴포넌트 기반 범용성 JSX란 무엇인가? JSX는 JavaScript XML의 줄임말로 문자열도 아니고 HTML도 아니다. React에서 UI를 구성할 때 사용하는 문법으로 JavaScript를 확장한 문법이다. 이 문법을 이용해서 React 엘리먼트를 만들 수 있다. JSX는 브라우저가 바로 실행할 수 있는 자바스크립트 코드가 아니기 때문에 Babel을 이용한다. Babel은 JSX를 브라우저가 이해할 수 있는 자바스크립트로 컴파일한다. 컴파일 후, 자바스크립트를 브라우저가 읽고 화면에 랜더링을 할 수 있다. JSX 규칙 하나의 엘리먼트 안에 모든 엘리먼트가 포함 JSX에서 여러 엘리먼트를 작성하고자 하는 경우, 최상위에서 opening tag와 closing tag로 감싸..