일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- next.js css
- input type=file
- icon
- bootstrap
- react env
- getModifierState
- dart 변수
- typescript react
- API 토큰
- API token
- npm styled-reset
- github io
- github
- fetch
- git lab
- rewrites
- CSS
- nextjs .env
- There isn’t anything to compare
- ngrok실행
- createGlobalStyle
- ngrok설치
- nextjs 설치
- react
- Git
- SCSS
- react typescript
- styled components
- 컨디셔널 렌더링
- nextjs
- Today
- Total
목록JavaScript (20)
꾸준히 성장하는 개발자

//에러 객체 만들기 const error = new TypeError('타입 에러가 발생했습니다') // 에러 발생시키기 throw error try catch 문 try { // 실행할 코드 } catch (error) { // 에러 발생 시 동작할 코드 } try { // 실행할 코드 } catch (error) { // 에러가 발상했을 때 실행할 코드 } finally { // 항상 실행할 코드 }
strict 모드(엄격 모드)를 활성하는 문구 JavaScript에서 오류가 발행할 수 있는 부분들을 미리 잡아주고 고쳐줄 수 있게 하여 문제를 더 빨리 해결할수 있도록 해준다. 사용방법 1. 전역 스코프에서 strict 모드를 사용 script 안에 최상단에 'use strict' 또는 "use strict" 작성해준다. 'use strict' let a= 10 function b(){...} 꼭 최상단에 써져 있어야 한다. 위에는 주석만 작성이 가능하고 그 외 다른 명령어가 작성되면 실행이 되지 않는다. 2. strict모드를 실행하고 싶은 특정 함수 안에서 실행 가능하다 // strict 모드 활성화 함수 function c(){ 'use strict' console.log(this) }; c();..
cookie -브라우저에 저장되는 데이터의 일종 -도메인 단위로 데이터 저장 (ex. a.com 에서 저장한 cookie는 b.com 에서 접근 불가) -용량과 개수에 제한이 있음 -만료일 설정 가능 -*자동으로 HTTP Request에 포함된다* (ex. 쿠키를 저장하고 나서 html 요청하면 해당 쿠키를 같이 전송) - 'key=value; key=value;' 이런 식으로 저장이 된다. document.cookie : 현재 페이지의 쿠키를 보여준다. document.cookie.split(' ; ') : ; (세미콜론)으로 나눠주면 쿠키가 몇 개인지 알 수 있을 것 document.cookie = 'name=gggg' : 쿠키를 이렇게 세팅도 가능하다. expires(유효 일자)나 max-age(만..

Promise :자바스크립트 비동기 처리에 사용되는 객체 Promise 객체는 비동기 작업이 맞이할 미래의 완료 또는 실패와 그 결과 값을 나타냅니다. 대기(pending): 이행하지도, 거부하지도 않은 초기 상태. 이행(fulfilled): 연산이 성공적으로 완료됨. 거부(rejected): 연산이 실패함. Promise를 공부해보자 fetch로 json파일을 불러오면 let fetched = fetch("https://jsonplaceholder.typicode.com/posts"); console.log(fetched) // Promise{...} fetch는 Promise 객체를 반환한다 promise는 두 개의 메서드를 사용할 수 있는데 then과 catch이다. 둘 다 콜백 함수를 받는다. ...

숫자 배열로 담아내기 const arr = Array.from(Array(100), (_, i) => i + 1); 100개를 넣어주는 배열이다 console.log(arr)로 찍어보기 아스키코드를 이용하여 문자를 배열로 담아내기 String.fromCharCode( ) : 아스키코드번호를 받아 문자열을 구성해주는 함수 대문자 알파벳 배열로 담아내기 const arr = Array.from({ length: 26 }, (v, i) => String.fromCharCode(i + 65)); console.log(arr)로 찍어보기 소문자 알파벳 배열로 담아내기 const arr = Array.from({ length: 26 }, (v, i) => String.fromCharCode(i + 97));
chart.js는 프로젝트안에 그래프들을 그려줄 때 쓰기 유용한 라이브러리이다. https://www.chartjs.org/ Chart.js | Open source HTML5 Charts for your website New in 2.0 New chart axis types Plot complex, sparse datasets on date time, logarithmic or even entirely custom scales with ease. www.chartjs.org html 파일 안에 CDN을 작성해준다 그리고 chart가 그려지기 원하는 부분에 canvas 태그를 이용하여 위치시켜준다. 그리고 https://www.chartjs.org/docs/latest/samples/scales/line..
https://momentjs.com/ Moment.js | Home Format Dates moment().format('MMMM Do YYYY, h:mm:ss a'); moment().format('dddd'); moment().format("MMM Do YY"); moment().format('YYYY [escaped] YYYY'); moment().format(); Relative Time moment("20111031", "YYYYMMDD").fromNow(); moment("20120620", "YYYYMMDD" momentjs.com moment는 날짜로 연산이 가능하다는 장점이 있다. 사용하는 방법 1. npm 을 이용한 설치 npm install moment 2. CDN 사용
1. fetch( ).then( ) fetch("https://jsonplaceholder.typicode.com/posts") .then((res) => { return res.json(); }) .then((obj) => { console.log(obj); }); 2. axios / async await axios Promise 기반의 HTTP 비동기 통신 라이브러리 Fetch와 Axios의 차이점은 Axios는 요청과 응답을 모두 JSON 형식으로 자동 변환시켜 줍니다. async await Promise 객체를 사용하더라도 .then() .catch() 등등 뒤에 붙이는 것들이 많아진다. 뒤에 뭐 안 붙이고, 더 간단하게 비동기 작업을 동기적으로 만들어주는 키워드가 바로 await 이다. cons..