일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 머신러닝종류
- 14658
- 싸피셜
- SQL
- Javascript
- 셀프넘버
- git
- pwa적용하기
- vitepwa
- sqld
- 리액트
- 싸피10기
- react
- db
- unionfind
- 데코레이터
- queryset
- TypeScript
- Django
- 알고리즘
- 싸피
- 플로이드워셜
- VITE
- SSAFYcial
- PWA
- SSAFY
- js
- 백준
- Python
- QuerySetAPI
- Today
- Total
목록TypeScript (6)
Meme's IT
🎧 타입 지정변수 만들 때 타입을 지정해 줄 수 있음let name :string = 'Mino'변수명 :타입명 의 형식으로 사용 타입으로 사용 가능한 것들string, number, boolean, bigint, null, undefined, [], {} 타입을 지정하는 이유?JS에서는 에러 메세지를 모호하게 알려주지만,타입을 지정해서 사용하면 어디서 에러가 나는지 알기 편함= 타입 관련 버그가 생겨도 빠르게 디버깅 가능let name :string = 'Mino'name = 123 // 여기서 에러가 생김 만약에 여러가지 타입이 가능하다면?해당 변수에 여러가지 타입의 데이터가 들어 올 수 있다면 | 기호를 사용함let name :string | number = 'Mino'name = 123 ..
배경 consult라는 type이 상당히 긴데, 자주쓰임 아이고 불편해…그래서 따로 빼서 import 하려고 함 해 보 자 고 src/types/DataTypes.ts 라는 파일을 만들어 주고, // DataTypes.ts // 고민 타입 export type consultType = { consultId : number, memberId : number, title : string, content : string, categoryId : number } 이런식으로 export를 바로 하면서 넣어주자 만약 여러개가 되어도 // DataTypes.ts // 고민 타입 export type consultType = { consultId : number, memberId : number, title : str..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cMWux6/btsF1mbI2ZY/xsJuiL6gKIVuHnSB9MaOZK/img.png)
배경 api요청을 하는 함수를 따로 빼놓고, import해서 불러와서 사용함 근데 함수 돌아가기 전에 set어쩌구를 했더니 결과가 화면에 안나옴(= 저장이 안됨) 그래서 비동기를 위해 async await 사용하고자 함 근데 타입 지정 어떻게 해야함? 공식 문서에서는 Promise 을 쓰라고 합니다. 해결한 코드 // 우선 함수가 들어있는 ts파일 import axios from "axios"; // 고민 타입 type consultType = { consultId : number, memberId : number, title : string, content : string, categoryId : number } // try-catch 사용했을 때 async function getConsults(): ..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/TYfN3/btsF3lhN2L3/xAMsI78J6tGKrEavKWi7l1/img.png)
프로젝트를 진행하면서, 그림 심리 검사를 하는 기능을 넣게 되면서 그림그리는 기능이 필요하게 되었다. 하고싶은건 캐치마인드처럼 웹에서도 마우스로 그릴 수 있고, 우리 프로젝트는 웹앱 기반이 될 것이기 때문에 터치로도 그릴 수 있는 기능으로 하고 싶었다. 프로젝트 환경 React + TypeScript 우선, 리액트를 쓰기 때문에 라이브러리가 엄청 많아서 처음에는 라이브러리를 이용해서 그림을 그릴려고 했다. 후보 1. 이 분야에서 제일 많이 쓰는 것 같아 보이던 Fabric.js Introduction to Fabric.js. Part 1. — Fabric.js Javascript Canvas Library Introduction to Fabric.js. Part 1. Today I'd like to in..
우선 설치부터, tailwind npm install -D tailwindcss postcss autoprefixer Next UI npm i @nextui-org/react framer-motion 이제 설정해주자 tailwind.config.js에서 /** @type {import('tailwindcss').Config} */ const {nextui} = require("@nextui-org/react"); export default { content: [ "./index.html", "./src/**/*.{js,ts,jsx,tsx}", "./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}", ], theme: { extend: {}, }, da..
기본 세팅 : typescript, react 기본적으로는 input 태그 사용 이런식으로 안보이는 input 태그 생성 그러고 나서 react의 useRef를 이용해서 const fileInput = useRef(null); 이런식으로 다룰 변수를 하나 만들어줌 그리고 file을 저장하기 위해 useState를 써서 const [file, setFile] = useState(null) file 변수도 생성 버튼이 눌리면 → 파일 선택이 되도록하기 위해서 버튼 하나 생성 후 onClick 걸어줌 {fileInput.current?.click()}}> 업로드하기 p태그 스타일은 tailwind CSS라 무시가능 그 다음에 input 태그에 fileInput을 ref로, onChange함수를 만들어서 걸어주..