프론트엔드 개발

Could not find a declaration file for module 'superagent-promise'. 'C:/Users/taenam.DESKTOP-VMNKLBD/Desktop/managent/my-app/node_modules/superagent-promise/index.js' implicitly has an 'any' type. Try `npm i --save-dev @types/superagent-promise` if it exists or add a new declaration (.d.ts) file containing `declare module 'superagent-promise';` next js로 만든 프로젝트를 빌드할 때, 위와 같은 에러가 나왔는데, npm으로는 추가가 ..

어느 때처럼 개발 후 git으로 github에 있는 repository에 push를 하려고 하였으나 아래와 같은 에러가 나타났다. 어느 사이트에서 좋은 자료가 있어, 내용을 공유하고자 한다. remote: Support for password authentication was removed on August 13, 2021. Please use a personal access token instead. remote: Please see https://github.blog/2020-12-15-token-authentication-requirements-for-git-operations/ for more information. fatal: unable to access 'https://github.com/[..

HTTP(Hyper Text Transfer Protocol)란 서버와 클라이언트가 인터넷 상에서 HTML 문서를 주고받을 수 있게 하기 위해 만든 protocol(통신 규약)입니다. 클라이언트 이 역할은 주로 브라우저에 의해 수행됩니다 웹 페이지는 하이퍼텍스트 문서로, 표시된 텍스트의 일부는 사용자가 웹을 돌아다닐 수 있도록 새로운 웹 페이지를 가져오기 위해 실행될 수 있는 링크임을 뜻합니다. 브라우저는 HTTP 요청 내에서 지시 사항들을 변환하고 HTTP 응답을 해석하여 사용자에게 명확한 응답을 표시합니다. 웹 서버 통신 채널의 반대편에는 클라이언트에 의한 요청에 대한 문서를 제공하는 서버가 존재합니다. HTTP 통신방식 HTTP통신은 클라이언트가 데이터를 요청하면, 서버는 그 요청을 처리하여 다시 ..

next-iron-session을 공부하고 있는데, 하위 폴더 examples의 next-typescript 폴더만 clone하고 싶었어요. 이처럼 github에서 특정 폴더만 clone하고 싶어서 구글링을 하였습니다. 공부하는겸 공유하는겸 올렸어요 ~~~~ 출처는 마지막에 있습니다 ~ 1. git 연결 (1) 폴더만들기 mkdir next-typescript (2) 폴더로 이동 cd next-typescript (3) git init 하기 git init 2. git 저장소 연결 git remote add origin 저장소주소 git remote add origin https://github.com/vvo/next-iron-session.git 3. git sparse checkout 활성화 git ..

이번 시간에는 Next JS에 Typescript를 더하여 사용해 볼 것인데, 공식 홈페이지를 보며 따라 하였다. Typescript 예제 사용방법 - 첫 프로젝트를 시작할 때, npm 또는 yarn을 이용하여 사용할 수 있다. npx create-next-app --ts # or yarn create next-app --typescript - 기존 프로젝트가 있다면, tsconfig.json 파일을 루트 폴더 바로 아래에 위치시킨다. Next.js는 이 파일을 기본값으로 자동 구성한다. 사용자 지정 컴파일러 옵션과 함께 고유한 tsconfig.json을 제공하는 것도 지원한다. 그런 다음 터미널에서 'npm run dev' 또는' yarn dev'을 실행하면 다음과 같이 컴파일이 완료되었다고 확인할 수..

제네릭이란? Generic: 통상적인, 일반적인 라는 뜻을 가졌고, 타입스크립트에서 Generic은 재사용 가능한 컴포넌트를 생성할 때 사용되며, 다양한 타입에서 작동하는 컴포넌트를 작성할 수 있다. Generic을 특징 다양한 타입을 받을 수 있기 때문에, 유연하다 컴파일 시에 타입 안정성을 보장한다. 재사용 가능하다. 제네릭 함수 (Generic Funtion) function PrintItems(args: T): T { console.log(args); return args; } const numberArray = [1,2,3,4,5]; const textArray = ["오늘", "즐거운 하루", "보내세요"]; const bool = true; const text = "오늘도 공부중입니다"; c..

cra로 만들어진 react를 yarn start 하면 , 매번 Browserslist: caniuse-lite is outdated. Please run:npx browserslist@latest —update-db 가 나타나는걸 볼 수 있다 해결방법 해당 프로젝트에서 터미널에 다음과 같이 입력하면 된다. npm update caniuse-lite browserslist 했음에도 불구하고 똑같은 문제가 발생한다면, env파일에 아래 내용을 추가하면 더이상 뜨지 않는다. 참고로 근본적인 해결책은 아니다. BROWSERSLIST_IGNORE_OLD_DATA=true

Type alias alias는 별명이라는 의미인데 따로 이름을 붙여주는 것이다. Type alias를 이용하면 다양한 타입을 정의할 수 있는데 기본적인 타입 뿐만 아니라 복잡한 타입도 정의할 수 있다. type Student = { class: number, name: string; } const student: Student = { class: 5, name: "taenami" } Student 타입은 object 타입인데, student라는 변수가 Student 타입인데, Student타입에서 정해진 key와, value의 타입을 지켜주지 않으면 에러가 발생한다. String Literal Types type Name = "name"; let taenami: Name; taenami = "name"..