전체 글
-
두시간 알고리즘 - 9일차, 다이나믹 프로그래믹 완전 정복 Chapter3, 4 예제Web Dev/2. JS 알고리즘 2021. 6. 4. 19:15
다이나믹 프로그래밍은 "복잡한 문제를 간단한 여러 개의 문제를 나누어 푸는 방법"으로 어떤 특정한 프로그래밍 기법같은게 아니다. 아무래도 이거 이름 지은 사람은 어쩌면 많은 프로그래머들의 삶에 죄를 조금씩 지은거아닐까. 이거때문에 혼란스러워하는 사람들이 한둘이 아니니. 내 느낌엔 복잡한 문제를 간단하게 풀어야겠다, 하는 마음가짐이 다이나믹 프로그래밍 같다. 안다고해서 문제를 풀때는 도움이 되는 느낌은 안들었다. 왜냐하면 어떻게 간단하게 풀건가, 부분이 핵심인데 다이나믹 프로그래밍이 뭔지 안다고 어떻게 간단하게 푸는진 알아지질 않더라. 그래도 어떻게 접근하면 좋을지를 익혀보려고 한다. . Chapter3예제 JavaScript화 // 코드 2-5 const cost = [ [0, 10, 75, 94], [..
-
GraphQL아주 조금만 살펴보기 - Node.jsWeb Dev/8. 메모 2021. 6. 3. 21:18
오늘은 갑자기 컨디션도 좀 안좋아서 평소에 제대로 좀 보고 싶었던 GraphQL관련 세미나를 들었다. Gatsby같은 경우에는 내부에서 데이터 끌어오는게 다 GraphQL이고, AWS에서 AppSync를 써도 GraphQL엔드포인트를 제공해주는거라 경험은 계속했는데 제대로 스키마가 무었인지 resolve는 어떻게하는지 서버에서 뭘처리해주길래 나는 그냥 프론트에서 db쿼리 날리듯 날리면 되는건지 보기로 했다. 공부 자료 https://frontendmasters.com/courses/server-graphql-nodejs/ 📡 Learn to create GraphQL APIs on the server in Node.js with Apollo Server with Scott Moss. Create a Gr..
-
두시간 알고리즘 - 8일차, 다이나믹 프로그래믹 완전 정복 Chapter1,2 예제 JavaScript화 하기Web Dev/2. JS 알고리즘 2021. 6. 3. 12:01
http://m.yes24.com/goods/detail/79257722 다이내믹 프로그래밍 완전 정복 - YES24 빠르고 우아한 상향식 문제 풀이법으로 코딩 면접 광탈에서 멘탈갑으로 거듭나기 다이내믹 프로그래밍(동적 계획법)은 알고리즘을 공부하다 마주치는 첫 번째 큰 장벽이다. 이 m.yes24.com 다이나믹프로그래밍 완전정복 책을 공부하기시작했다! 알고리즘쪽에서 늘수있을가 의심이되기까지하는 분야가 다이나믹 프로그래밍이라 이책으로 진짜 제발 이게 뭔지 이해를 했으면 좋겠다. Chapter1. 재귀 호출의 이해 재귀호출 문제를 풀때는 항상 뭔가가 찜찜한 마음으로 푸는데, 이 책에서 쉽게 표현하기로는 문제의 풀이법을 직관적으로 정리하기 어려울때 문제의 크기를 줄여놓고, 큰 문제와 작은 문제의 관계 속에..
-
Chart그리는 툴 - react-chartjs-2(TypeScript관련 에러처리)Web Dev/3. React 관련 2021. 6. 2. 13:24
간단하게 Chart를 그려야해서 찾아보니, react-chartjs-2라는게 있었다. 기반은 Chart.js이고 이 라이브러리의 React Wrapper이다. react-chartjs-2 https://github.com/reactchartjs/react-chartjs-2 reactchartjs/react-chartjs-2 React wrapper for Chart.js 2.0 and 3.0, the most popular charting library 📊 - reactchartjs/react-chartjs-2 github.com 설치는 react-chartjs-2, chart.js 둘다 해야하고, TypeScript를 쓰는 프로젝트면 이것도 필요해서 설치를 했다. type관련 설치 https://www..
-
Json에서 Type 바로뽑아주는 사이트Web Dev/8. 메모 2021. 6. 2. 12:59
환장하게 길고 중첩된 Response를 보고 타입을 다 뽑으려니까 골이 아파가지고 찾아보니 아래의 사이트가 있었다. https://jvilk.com/MakeTypes/ MakeTypes from JSON samples Statically type check code that interacts with JSON objects Proxy objects generated with MakeTypes are expressed as TypeScript classes, so you can statically type check that your code is appropriately accessing fields on the JSON object. Code against web s jvilk.com 좌측 상단에 객체..
-
Tailwind css로 초간단 Dropdown 메뉴 구성하기Web Dev/8. 메모 2021. 6. 2. 11:23
const DropDown: FC = ({ children, title }) => { const [open, setOpen] = useState(false); return ( setOpen(!open)} > {title} // children으로 받은 것들에 적용할때 {cloneElement(children, { className: `transform ${ open ? `scale-y-100` : `scale-y-0` } transition duration-500 ease-in-out origin-top w-full bg-white absolute text-black text-center border-2`, onClick: () => setOpen(!open), })} // 바로 style 적용 setO..
-
Generator와 비동기처리Web Dev/1. JS 문법 관련 2021. 6. 2. 10:12
redux saga를 사용하다보니 내부가 다 Generator였다. 대강 어떻게 굴러가는진 알겠지만 Generator와 Promise가 처리되는 흐름이 영 매끄럽게 이해가 되지 않아서 Modern JavaScript Deepdive 46장을 읽어보았다. 제너레이터란 function* test(array) { for(let i = 0; i < array.length; i++){ yield array[i] } } const getArray = test([1,2,3,4,5]) getArray.next(); getArray.next(); getArray.next(); getArray.next(); getArray.next(); getArray.next(); 이렇게 나온다. 제너레이터 함수를 호출하면 함수를 실행..
-
Redux Toolkit, Redux Saga와 TypeScriptWeb Dev/3. React 관련 2021. 6. 1. 15:15
Redux를 통해서 상태관리를 하면 좋은데, 여전히 코드가 너무 많지 않은가 싶어서 써본 Redux Toolkit은 정말 편하긴하다. Redux Saga와 TypeScript랑 같이써서 간단하게 API를 쏘고 응답을 받아서 처리하는 것을 해보면서 참고한 자료를 정리해두려고 한다. 전체적인 흐름은, 우선 Store에서 Thunk를 안쓸거라(toolkit은 Thunk를 기본으로 제공), 걔를 꺼줘야한다. 1. Thunk 끄기 import { configureStore, Action, getDefaultMiddleware } from "@reduxjs/toolkit"; import userSlice from "./userSlice"; import createSagaMiddleware from "redux-sa..