typescript 7

[TS] Interface (인터페이스)

🧐 interface (인터페이스) 란? 함수나 객체, 클래스의 스펙에 대한 정의 어떤 속성을 가지고 있어야 하는지에 대한 정의interface Person{ name:string; age:number;} 🌀 선택적 프로퍼티객체 타입에서의 선택적 프로퍼티와 유사프로퍼티가 있어도 되고, 없어도 될 때 '?'를 붙임interface Person{ name:string; age?:number;} 🌀 읽기 전용 프로퍼티객체가 처음 생성될 때만 수정 가능한 프로퍼티처음 생성 이후의 재할당 불가!interface Person{ name:string; readonly age: number}  🌀 인데스 시그니처 프로퍼티정의되지 않은 동적 타입의 할당이 필요할 때 사용interface Person{ n..

TypeScript란?

🧐 TypeScript란 무엇인가? 👉 자바스크립트의 슈퍼셋, 자바스크립트의 확장된 버전이다. 정적 타입 언어로서 코드를 작성할 때 변수, 함수, 객체등의 데이터 타입을 명시하고 컴파일 타임에 타입 검사를 수행한다. 이를 통해 코드의 안정성을 향상시키고 버그를 사전에 방지할 수 있으며, 대규모 애플리케이션의 개발과 유지보수를 더 쉽게 만들어준다. 슈퍼셋(Superset) : 어떤 언어나 기술이 다른 언어나 기술의 확장 또는 상위 집한인 경우를 가리킨다. 원래 언어나 기술의 모든 기능을 포함하면서 추가적인 기능이나 확장을 제공한다는 것을 의미한다. 🧐 TypeScript를 사용하는 이유? 👉 타입 안정성 : 컴파일 타임에 타입 오류를 발견할 수 있으므로 런타임 오류를 사전에 방지할 수 있다. 👉 IDE(통..

backend server와 연결

시작하기 | Axios Docs 시작하기 브라우저와 node.js에서 사용할 수 있는 Promise 기반 HTTP 클라이언트 라이브러리 Axios란? Axios는 node.js와 브라우저를 위한 Promise 기반 HTTP 클라이언트 입니다. 그것은 동형 입니다(동일한 코 axios-http.com axios 받아올 것이기 때문에 공식문서를 참조했다. yarn add axios로 axios먼저 깔고 나는 회원가입 쪽을 연결했는데 회원가입에서 이메일 중복확인이나 닉네임 중복확인을 하기 위해서 get 요청을 했는데 왜 그런지 모르다가 중복확인할 때 post로 하는 블로그가 있어서 post요청으로 해보자 해서 post요청으로 하니 Response 잘 받아와 짐. 근데 조회하는건데 get이 아니라 post를 쓰..

팀 프로젝트 4주차 회고

4주 차 회고(06.19~06.25) 벌써 4주 차가 지나고 지금 5주 차째!! 4주 차에는 많은 일을 한 것은 아님 그냥 게시글 등록 UI 만든 정도? 잠깐 쉬어가는 시간이라고 생각함 이때 공부했어야 하는데.... 일단 이번주는 게시판 새 글 작성에 대한 것을 했다. input으로 쓰기에는 좀 긴 것 같아서 본문 입력창을 textarea태그로 해놨다. 거기다 textarea의 속성으로 row를 주면 줄 수만큼 크기가 커지고 사용자가 마음대로 본문창의 크기를 늘리고 줄이는 게 좋을 것 같아서 결정. 글 작성창에서 x를 누르면 진짜 닫기를 누를 건지 확인하는 모달창이 또 뜨게 만들었다. 사진은 최대 3개까지 담을 수 있고 담긴 사진을 미리 보기 할 수 있게 했다. 사진 위에 X버튼을 누르면 지워진다. 아직..

RandomShop 살리기 project 00

나의 개인프로젝트인 RandomShop을 살려보려고 한다. 포트폴리오에 넣을 수 있을 정도로는 만들어 놔야하니까... 일단 초반 기술 스택은 TypeScript , React, Vite, Firebase, styled component 다섯 개다. 여기에 나는 tailwindcss & daisyUI를 더할 예정이다. 기능은 원래 firebase : 백엔드 서비스 연동, 회원가입 및 로그인, 구글 소셜로그인 음식 검색 및 검색 키워드 자동완성 음식 필터링(카테고리 분류) + 페이지네이션 카트 담기 위시리스트 이 정도이고, 와이어 프레임 초안은 아래에 있다. 너무 초... 라해 https://www.figma.com/file/sOrN4ihZAG0myOJTVpGYLn/wireframe?type=design&n..

input type file

저번에 만들었던 모달 안에 게시글 등록 폼을 작성할 예정 일단 img파일을 넣기 위해서 type=file인 Input 태그를 사용할 예정임 import { useRef } from "react"; import { TiPlus } from "react-icons/ti"; import NewBoardForm from "./BoardForm"; function NewBoardBtn() { const dialogRef = useRef(null); const Open = () => { dialogRef.current?.showModal(); }; const Close = () => { dialogRef.current?.close(); }; return( 등록 ) 뭔가 애매하다... ui좀 바꿔야 할 것 같아서 U..

728x90