본문 바로가기

TypeScript6

[Next.js]Supabase CLI로 각 테이블에 맞는 타입 생성 feat. More simple 저번 시간에는 Supabase에서 TypeScript에 적용할 수 있는 타입을 추출할 수 있도록 cli로 supabase cli를 설치 및 로그인 후 데이터베이스와 관련된 타입을 파일로 얻어오는 것을 확인했다.해당 사항 진행 중에 더 다른 쉬운 방법도 알게되어, 공유하고자 포스팅을 작성합니다. 1. Supabase Dashboard로 들어와서 위와 같은 경로를 따라, Generate and download types를 눌러준다.2. 해당 Action은 cli환경에서 굳이 설정하지 않아도, supabase web에서 데이터베이스의 type을 typescript에서 만들 수 있도록 도와준다. 3. 전 글과 같이 Import하여 사용하면 된다. 2024. 10. 23.
[Next.js]Supabase CLI로 각 테이블에 맞는 타입 생성 프로젝트를 진행하는 도중 supabase의 type을 쉽게 꺼내는 방법이 있다고 팀원분께서 말씀해주셔서 해당 사항을 토대로 포스팅을 작성해보도록 한다. 해당 사항은 Supabase Docs에서도 확인이 가능한 사항이다. [Generating TypeScript Types]https://supabase.com/docs/guides/api/rest/generating-types1. yarn add supabase --dev-supabase cli를 프로젝트에 설치2. yarn supabase login-supabase cli를 통해 supabase 계정에 로그인하는 과정 3. project의 아이디가 필요하다. project 아이디는 supabase 프로젝트를 생성했을 때 대쉬보드에 접근하면 url에서 얻을.. 2024. 10. 23.
[TypeScript] Generic과 Utility Type 1. Genericfunction printStrings(arr: string[]): void {    for (let i = 0; i arr.length; i++) {        console.log(arr[i]);    }}function printNumbers(arr: number[]): void {    for (let i = 0; i arr.length; i++) {        console.log(arr[i]);    }} 위 함수들은 기능이 비슷하지만, 각각 String 타입과 number 타입의 배열을 처리할 수 있는 함수이다.위와 같은 코드가 많아졌을 때 하나의 함수로 만들 수는 없을까? -> 이러한 상황에서 Generic을 사용할 수 있다.Generic은 타입을 변수처럼 사용하는.. 2024. 9. 27.
[TypeScript] Type 추론 // 타입 추론 : TypeScript의 중요한 기능 중 하나로, 개발자가 타입을 명시적으로 지정하지 않아도, // 타입 안정성을 유지할 수 있도록 도와줌let numbers = [1,2,3,4,5];let string = ["a","b","c"];// { name: string; age: number }로 추론let person = {    name: "Alice",    age: 25}; person.name = "Bob"; // 정상person.age = 30; // 정상person.age = "thirty"; // 오류: 'string' 형식은 'number' 형식에 할당할 수 없습니다. // 객체 리터럴 방식의 추론 let person = {    name: "Alice",    age: 25}.. 2024. 9. 27.
[TypeScript] 여러가지 Type 선언 function add(a: number, b: number): number {    return a + b;  }    const sum: number = add(1, 2); // Error  console.log(sum);    //Boolean  let isBoolean: boolean;  let isBooleanFalse: boolean = false;  //Number  let num : number;  let nan : number =  NaN;// stringlet str : string;let name : string = "tester";// Arraylet names : string[] = ["tester","tester2","tester3"];let someArr : any[] = [".. 2024. 9. 26.
[TypeScript] TypeScript 정리.. 1. TypeScript = Javascript + type브라우저에서 사용 하기 위해 10일만에 만들어진 언어..  자바스크립트의 단점 -> 매우 자유롭고 ,모든걸 수정할 수 있다 -> 이 문제점을 정적 타입 시스템으로 보완한것이 TypeScript  타임스크립트는 똑같이 동작하는 자바스크립트의 확장팩 그 이상 그 이하도 아님 -> 거의 비슷함.  TypeScript etc...1. Python으로 만든 pipy가 python보다 빠르다.1-1. pipy로 만든 pypypi가 훨씬 더 빠르다.2. TypeScript는 100% TypeScript로 만들어져 있다.. 2. TypeScript  Settingnpm install typescript 3. TypeScript Setting Check{  "n.. 2024. 9. 20.