fullfish의 개발자 도전기

Route src/routes 폴더에 각각의 페이지 컴포넌트 만들고 src/Router.tsx에 아래처럼 라우팅을 한다 // Router.tsx import { BrowserRouter, Switch, Route } from 'react-router-dom' import Coin from './routes/Coin' import Coins from './routes/Coins' function Router() { return ( ; ) } export default Router useParams로 해당 url의 params를 가져올 수 있다 // /src/routes/Coin.tsx import { useParams } from 'react-router' interface Params { coinId: ..

npx create-react-app 내 앱 이름 --template typescript npm i --save-dev @유형/styled-components npm i styled-components // index에서 root에러가 난다면 const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement) //이렇게 수정 interface : object shape(객체모양)을 TypeScript에게 설명해주는 개념 interface PlayerShape { name: string age: number } const sayHello = (playerObj: PlayerShape) => `Hello ${playerObj.nam..

쓰는 이유 1. Type 안정성 // js는 [1,2,3] + false === '1,2,3false' function divide(a,b){ return a/b } divide('xxx') === NaN // 인자가 2개가 들어오지도 않았고 타입도 안맞지만 에러를 안띄움 2. 런타임에러(코드실행중의 에러) 방지 const obj = {name:'manseon'} obj.hi() // obj.hi is no a function에러가 뜸 // 즉, 실행을 이미 시키고 에러를 띄움 // 애초에 obj에 hi가 없음을 먼저 인지하는 편이 좋음 문법 타입을 지정안해줘도 추론함 let a = 'a' a = 'b' // ok let a = 'a' a = 1 //type 에러 남 구체적 명시 let b : boole..

tag에 style 직접 먹일 때 일반적 사용법 : 이름을 붙여 줄 수 있다 const BoxOne = styled.div` background-color: teal; width: 100px; height: 100px; ` props내리기 가능 const Box = styled.div` background-color: ${props => props.bgColor}; width: 100px; height: 100px; ` 컴포넌트 extend하기 const Box = styled.div` background-color: ${props => props.bgColor}; width: 100px; height: 100px; ` const Circle = styled(Box)` border-radius: 50px..

//! 1진트리 class Tree { //tree의 constructor를 생성 : tree의 자식 노드들을 엘리먼트로 담을 children 배열로 선언 constructor(value) { this.value = value this.children = [] } // 자식 노드 생성 메소드 구현 : new 키워드로 자식 노드를 생성 한 후, children 배열에 push insertNode(value) { const childNode = new Tree(value) this.children.push(childNode) } // tree에서 value값을 탐색하기 위한 메소드 구현 contains(value) { // 현재 노드의 value 값이 찾는 값과 일치한다면 true 반환 if (this.va..

let arr = [128, 460, 603, 40, 521, 137, 123] let result = max= sum =0 arr.forEach((arrEle)=>{ sum = String(arrEle).split('').map(ele=>parseInt(ele)).reduce((acc,cur)=>acc+cur) if(sum >= max && arrEle>result ){ max = sum result = arrEle } }) 브루투포스 맨토 let arr = [ [3, 4, 1, 2], [4, 3, 2, 1], [3, 1, 4, 2], ] let count = 0 let obj = { 1: [], 2: [], 3: [], 4: [] } arr.forEach(arrEle => arrEle.forEach(..

function makeObj() { let num = 0 let obj = {} for (let i = 65; i 90 && 97 > i)) obj[String.fromCharCode(i)] = [Math.round(num * 10000) / 10000, Math.round((Math.round((num += 0.018) * 10000) / 10000 - 0.0001) * 10000) / 10000] } obj[' '] = [0.936, 0.9539] obj['end'] = [0.954, 1] return obj } function compression(str) { let obj = makeObj() let compressionRange = [0, 1] let num_2 = '0.' for (let i..

코딩지도사 1급이라는 자격증이 있길래 그냥 따봤는데 큰 의미는 없고 자격증으로 돈벌이하는것같다..

// n이 양수여야함 function factorial(n) { return n !== 1 ? n * factorial(n - 1) : 1 } 위 코드에 비해서 아래 코드는 n이 0 일때, 한번 더 반복되지만 n이 0이라도 에러 안남 // n이 0이상이여야 함 function factorial(n) { return n ? n * factorial(n - 1) : 1 }

순열 function solution(arr, n) { let result = [] function DFS(n, tempArr) { if (n === 0) return result.push(tempArr) for (let i = 0; i < arr.length; i++) { if (!tempArr.includes(arr[i])) DFS(n - 1, tempArr.concat(arr[i])); } } DFS(n, []) return result } // n만 주어졌을 때 function solution(n) { let result = [] let N = n function DFS(n, tempArr) { if (n === 0) return result.push(tempArr) for (let i = 1; i