공부27 2021.06.23 2021.06.23 오늘은 처음으로 Linux 기반의 운영체제인 Ubuntu의 기본 사용법과 node.js에 대해 공부를 했다. node.js는 조금 익숙했지만 윈도우즈에 익숙했던 나는 ubuntu의 터미널 생소했고 약간 불편했다. 아직까지 윈도우로 개발 공부하면서 딱히 문제가 생겼던 적은 없었지만, 나중에 서버를 개발하다보면 윈도우에서 지원하지 않는 부분이 있다고 한다. 그러니 지금부터라도 ubuntu를 사용해서 익숙해져야 할 필요가 있을거 같다. 명령어들을 블로그에 정리해서 눈에 자주 익혀야 겠다. 2021. 6. 23. 2021.06.22 2021.06.22 어제 만들었던 계산기를 내 나름대로 다시한번 만들어 보았다. 원래는 숫자를 입력하고 연산자를 누르면 전에 입력했던 숫자가 사라져서 어떤 숫자들을 입력했는지 확인할 수 없었지만, 새로 만든 계산기는 엔터를 눌러야지만 계산이 된다. 사칙연산 순서에 맞춰서 *나 /가 있으면 가장 먼저 계산한다. 연산자를 두번 연속 입력(2++3)하는 것은 안되게 했고, 2+4- 이렇게 입력을 하면 자동으로 마지막에 있는 -는 빼고 계산을 한다. 계산 결과가 잘 나오는 것을 확인할 수 있다. 2021. 6. 22. 2021.06.21 2021.06.21 오늘은 계산기를 만들어 보았다. 코드스테이츠를 시작하기 전에 미리 독학을 조금 했기에 그렇게 어렵지는 않았지만, 생각할게 조금 있었다. 평소 pseudocode를 작성하지 않고 코딩하는 습관 때문에 시간이 좀 더 걸린 거 같다. 왜 pseudocode를 먼저 작성해보는지 조금 알 거 같다. querySelector를 이용해 DOM 요소를 조작하였고, CSS로 나름 이쁘게 꾸며보려고 노력하였다. 과제 제출하는 과정을 통해 현업에서 Github를 어떻게 이용하는지 조금이나마 배울 수 있었다. 2021. 6. 21. 알면 좋은 자바스크립트 최신 문법 알면 좋은 자바스크립트 최신 문법 Shorthand property Object에서 속성과 값이 같을 때 생략이 가능하다 https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Object_initializer Optional Chaining Object?. 로 사용하며 객체 내 참조가 null일 경우 에러가 발생하는 대신 undefined으로 리턴을 한다. https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Optional_chaining Spread Syntax iterable 문자열, 배열의 요소를 펼쳐주는 문법이다. 배열이나 객체를 복사할 수 있.. 2021. 6. 17. 정규표현식(RegExp) 정규표현식(RegExp) 정규식, Regular Expression 역할 문자 검색 문자 대체 문자 추출 테스트 사이트 https://regexr.com/ 정규식 생성 // 생성자 new RegExp("표현", "옵션"); new RegExp("[a-z]", "gi"); const regexp = new RegExp("the", "gi"); // 리터럴 /표현/플래그(옵션) /[a-z]/gi const regexp = /the/gi; 메소드 메소드 문법 설명 test 정규식.test(문자열) 일치 여부(Boolean) 반환 match 문자열.match(정규식) 일치하는 문자의 배열(Array) 반환 replace 문자열.replace(정규식, 대체문자) 일치하는 문자를 대체 const regexp = /.. 2021. 6. 16. Apollo GraphQL with Prisma GraphQL : 페이스북에서 만든 쿼리 언어로, API에 있는 데이터를 쉽고 정확하게 클라이언트에게 요청할 수 있는 기능을 제공한다. Setup npm install apollo-server graphql npm i prisma -D npm i @prisma-client -D Usage const {ApolloServer, gql} = require('apollo-server'); const typeDefs = gql\` // Schema definitions go here type Track { id: ID! title: String! } type Query { tracks : [Track] track(id: Int!) : Track } \`; const resolvers = { Query: { tr.. 2021. 6. 14. 유용한 VSCode extensions Auto Import Auto Rename Tag Bracket Pair Colorizer Material Theme Material Theme Icons Prettier 2021. 6. 12. 이전 1 2 3 다음