일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 | 31 |
- Component
- 원티드
- TypeScript
- es6
- JS
- localstorage
- 파이어베이스
- react
- 리액트
- Redux
- react localStorage
- 비트 연산자
- firebase
- axios
- array
- 프로그래머스
- 타입스크립트
- state
- til
- v9
- 브라우저
- 프리온보딩
- 컴포넌트
- Reducer
- 프론트엔드
- CORS
- Frontend
- JavaScript
- 알고리즘
- 자바스크립트
- Today
- Total
목록전체 글 (126)
도리쓰에러쓰

새로운 Repository를 만들고 push 하려고 했는데 아래와 같은 오류가 떴다. 새로운 Repository에 README.md 파일이 있었고, push 하려는 파일 중에도 README.md 파일이 있어서 에러가 난 듯 싶었다. 그래서 pull 하고 push를 해도 똑같은 오류가 발생했다. 💡 해결 방법 - 브랜치명 앞에 +를 붙여주면 강제로 PUSH가 된다. - [분홍글씨] : 수기 입력 (브랜치명은 보통 master 아님 main입니다.) git push origin +[브랜치명] 🚨 강제 PUSH를 하면 기존 Repository에 있는 내용이 다 사라질 수 있으니 주의 !

이번에 개인 프로젝트를 공공데이터포털에서 제공하고 있는 Open API를 기반으로 만들려고 한다. 아래 공공데이터포털 사이트에 가입하여 원하는 API에 대해 활용신청을 하면 된다. 공공데이터 포털 국가에서 보유하고 있는 다양한 데이터를『공공데이터의 제공 및 이용 활성화에 관한 법률(제11956호)』에 따라 개방하여 국민들이 보다 쉽고 용이하게 공유•활용할 수 있도록 공공데이터(Datase www.data.go.kr React 프로젝트 기본 세팅은 아래와 같다. 🔶 프로젝트 기본 세팅 1. 터미널에 npx create-react-app 프로젝트명 입력하여 프로젝트 생성 2. 터미널에 npm install add axios 입력하여 axios 라이브러리 설치 3. App.js에 axios 라이브러리 impo..

'모던 자바스크립트' 책을 읽고 익숙하지 않은 내용 위주로 정리 해보려고 한다. 우선, 연산자와 피연산자의 의미는 아래와 같다. 1 + 2 연산자 : 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입, 지수 연산 등을 수행해 하나의 값을 만든다. (위 예시에서 +가 연산자이다.) 피연산자 : 연산의 대상 (위 예시에서 1과 2가 피연산자이다.) 1. 단항 산술 연산자 1️⃣ + 단항 연산자는 피연산자에 어떠한 효과도 없다. 음수를 양수로 반전하지도 않는다. +10;// 10 +(-10);// -10 숫자 타입이 아닌 피연산자에 + 단항 연산자를 사용하면 피연산자를 숫자 타입으로 변환하여 반환한다. 이 때, 피연산자를 변경하는 것이 아닌 숫자 타입을 변환한 값을 생성하여 반환한다. // 문자..

자바스크립트 ES6 문법에서는 숫자(number) 타입, 문자열(string) 타입, 불리언(boolean) 타입, undifined 타입, null 타입, 심벌(Symbol) 타입, 객체 타입 총 7개의 데이터 타입을 제공했는데, ES11 문법에서 BigInt라는 새로운 데이터 타입이 추가되었습니다. 그럼 지금부터 BigInt에 대해서 알아보겠습니다. 1. 선언 방법 BigInt는 길이의 제약 없이 정수를 다룰 수 있게 해주는 숫자형입니다. BigInt를 선언하기 위해 총 3가지 방법이 있습니다. let bigInt1 = 184738832473n; let bigInt2 = BigInt("123123123123123"); let bigInt3 = BigInt(10000000000); console.log..
이번 게시물에선 유저가 메인페이지 접속하면 서버가 리액트로 만든 html 파일을 보내주는 것을 해보겠습니다. 서버만들 때 Express + MongoDB를 사용하면 JS만으로도 풀스택 개발을 할 수 있는데, 여기에 React를 더할 수 있습니다. 1️⃣ express 라이브러리를 설치합니다. 1) 작업 폴더를 오픈한 상태에서 터미널에 npm init 입력 후 선택하라고 뜨는 것들을 끝날 때까지 Enter합니다. 2) npm install express 입력합니다. 3) server.js 파일을 만들고 아래 코드를 작성합니다. const express = require('express'); const path = require('path'); const app = express(); const http =..
저번 게시물에 이어서 작성하겠습니다. (코드 참고) [React] shop 홈페이지 기능 완성하기 가이드 저번 게시물에 이어서 작성하겠습니다. (코드 참고) [React] Redux5 :: useSelector, useDispatch 저번 게시물에 이어서 작성하겠습니다. (코드 참고) [React] Redux4 :: dispatch로 데이터 보내기 저번 게시물에.. dori-coding.tistory.com state 데이터를 기억하게 하려면 2가지 방법이 있습니다. 1️⃣ 서버로 보내서 DB에 저장하기 2️⃣ 브라우저 저장공간인 localStorage에 저장하기 저는 localStorage에 데이터를 저장해보도록 하겠습니다. localStorage에 대해서 알고 싶은 분들은 아래 게시물을 참고해주시면 ..
1. 개발자도구에서의 localStorage - localStorage는 개발자도구 - Application - Local Storage 에서 데이터 확인이 가능합니다. * Local Storage · 브라우저 청소하지 않는 이상 브라우저에 데이터가 남아있습니다. · Key, Value 각각 텍스트 5MB 정도 저장이 가능합니다. * Session Storage : 브라우저 끄면 데이터가 날아갑니다. 2. localStorage 문법 - JS 에서 다음 문법을 쓰면 localStorage의 데이터를 입출력 할 수 있습니다. localStorage.setItem('Key', 'Value'); localStorage.getItem('Key'); localStorage.removeItem('Key'); * l..
PWA(Progressive Web App) : 웹사이트를 모바일 앱처럼 설치해서 쓸 수 있습니다. 📌 PWA 장점 1️⃣ 모바일에 웹사이트 설치 가능 - 설치된 앱 접속하면 상단 URL바가 제거된 브라우저가 뜹니다. 2️⃣ 오프라인에서도 동작 가능 - service-worker.js라는 파일과 브라우저의 Cache storage 덕분에 가능합니다. - JavaScript로 게임만들 때 유용합니다. 3️⃣ 설치 유도 비용이 매우 적음 - 앱설치를 유도하는 마케팅 비용이 적게 듭니다. ( 구글플레이 스토어나 앱스토어 방문해서 앱 설치하고 다운받게 하는 것은 항상 매우 높은 마케팅 비용이 들기 때문입니다. ) 1. PWA 프로젝트 설치 1️⃣ PWA 세팅이 완료된 프로젝트를 생성합니다. 터미널에 npx cr..