반응형 TypeScript6 [TS]Visual Studio Code 에서 타입스크립트 제네릭 사용시, auto close tag 로 불편할 경우! Typescript 의 Generic 기능을 사용할때, 태그와 동일한 모양새 때문에, 자동 닫기 태그가 활성화 되어 매번 불편하다. ! 설정을 통해서 TypeScript 에서는 자동닫기를 비활성화 하면 도움이 된다. Ctrl+Shit+P > Prefrences: Open User Settings(JSON) "auto-close-tag.activationOnLanguage": [ "html", "xml", "javascript", "javascriptreact", "typescriptreact", 2024. 9. 10. [TS]graphQL 샘플 프로젝트 생성 ( feat. GraphQL과 타입스크립트로 개발하는 웹 서비스 ) node -v : 20.16.0 # 프로젝트 구성 ( 프로젝트 루트 /graphql-book-fullstack-project )npm i -g yarn git init .gitignore 파일 생성 ( 아래 사이트에서 react, node 를 넣고 파일로 생성 )gitignore.io - 자신의 프로젝트에 꼭 맞는 .gitignore 파일을 만드세요 (toptal.com)# 프론트 생성 make projectcd projectyarn create react-app --template @chakra-ui/typescript web cd web yarn startyarn add @apollo/client graphql# 백엔드 생성 ## /project 에서 mkdir server cd server yarn.. 2024. 9. 9. [TypeScript]제네릭 선언 안 닫게 하기 ( auto-close-tag plugin ) 플러그인을 찾아서 톱니바퀴 선택 Extension Settings 선택후, 아래 그림 선택 셋팅파일에 제외할 언어를 빼준다. "auto-close-tag.activationOnLanguage": [ "html", "xml", "javascript", "javascriptreact", "typescriptreact" ], typescriptreact 를 넣자니, 똑같고 빼자니 안닫히고... 계륵이다... 2024. 6. 27. [TS]Next.js 기초 - SSG 실습을 위해 next.js 프로젝트를 생성한다. npx create-next-app@latest --ts next-sample생성시 질의는 모두 No~~! SSG - Static Site Generation 정적사이트 생성빌드시 페이지를 생성한다. -- 사용 함수export const getStaticProps: GetStaticProps = async(context) =>pages/ssg.tsx 로 파일생성한다.next.js 에서는 폴더/파일 구조로 tsx 파일을 생성하면 그대로 호출 주소가 된다.즉, localhost:3000/ssg 로 호출 하면 이 페이지가 호출된다.import { GetStaticProps, NextPage } from "next";import Head from "next/h.. 2024. 6. 22. [Next.js]공식사이트 튜토리얼 따라하기 Learn Next.js | Next.js (nextjs.org) Learn Next.js | Next.jsLearn how to build a full-stack web application with the free, Next.js App Router Course.nextjs.org ** Next.js 는 이런거군 **1. 폴더로 라우팅 설정이 가능하다. 하이레키하게 설정이 된다. 주소와 폴더의 트리구조가 매핑! ( 직관적임)2. 폴더별로 page.tsx layout.tsx 파일을 생성해서 기본 값을 설정할 수 있다. 3. 루트(app/)의 layout.tsx 은 전체에 영향을 끼친다.4. php 를 대체? 하는게 목적이어서, 단순 SSR 뿐만아니라 서버리스 연동으로 마치 서버페이지역할도 한다. ( 예.. 2024. 5. 31. typescript 공부를 위한 기초 환경설정 # node -v : 16.14.0 mkdir project_name cd project_name npm init -y npm i -D typescript tsllint @types/node ** npm 옵션 i : install 모듈 설치 npm5 이후에는 package.json 에 같이 추가 -D: --save-dev 와 동일 devDependency 에 추가 product 컴파일시 배포 안함! #tsconfig.json 파일 생성 { "compilerOptions": { "lib": ["ES2015"], "module": "commonjs", "outDir": "dist", "sourceMap": true, "strict":true, "target": "ES2015" }, "include": [ ".. 2022. 5. 30. 이전 1 다음 반응형
