profile
촙촙 개발자의 TIL 기록 블로그입니다. 모든 내용 정확하지 않을 수 있어요. 문제가 있는 글엔 댓글주세요~!
태그 목록
전체보기 (85)Backend(18)JavaScript(18)React(17)python(16)django(12)nodejs(9)git(6)프로젝트1차(6)typescript(6)github(5)express(5)graphql(4)Crawling(4)클론코딩(4)CSS(3)vscode(3)npm(3)JWT(3)scss(3)CRA(2)http(2)ESLint(2)webpack(2)Module(2)package.json(2)Prettier(2)beautifulsoup(2)Database(2)bcrypt(2)nextjs(2)authorization(2)TIL(2)authentication(2)gatsby(2)인증인가(2)노마드코더(2)예외처리(2)react.js(1)tree(1)typeError(1)&&(1)클로저(1)setState(1)is not a function(1)html(1)v8(1)front end(1)ORM(1)async(1)비동기(1)가상환경(1)vue.js(1)error(1)SSR(1)hook(1)code 명령어(1)destructuring(1)transform(1)transition(1)blog(1)yarn(1)prefetch_related(1)set(1)import(1)package(1)sys.modules(1)sys.path(1)install(1)data structure(1)rebase(1)callback(1)fs(1)static file folder(1)express-handlebars(1)크로스브라우징(1)소수점(1)templete engine(1)Synchronous & Asynchronous(1)null(1)undefined(1)Virtual Environment(1)conda 명령어(1)function parameters(1)try except(1)core module(1)POST method(1)built-in modules(1)asterisk(1)unpacking(1)Cross Browser Testing(1)AqueryTool(1)역참조(1)related_name(1)정참조(1)package list(1)not defined(1)reference error(1)github blog deploy(1)github reset(1)grapyql(1)surge(1)암호화(1)pip(1)Token(1)ref(1)interface(1)async await(1)Absolute Path(1)Relative Path(1)miniconda(1)document.js(1)HTTPie(1)git remote(1)Request(1)Response(1)selenium(1)icon(1)coding convention(1)spa(1)웹 크롤링(1)nodemon(1)erd(1)node sass(1)tofixed(1)beautifulsoup4(1)데이터구조(1)parseFloat(1)Sync(1)queryset(1)gitignore(1)code convetion(1)try catch(1)비동기함수(1)input auto focus(1)gh-pages(1)getInitialProps(1)models(1)salting(1)flow(1)create repository(1)resetcss(1)version control system(1)CSS pre-processor(1)라우트(1)animation(1)git merge(1)squash(1)Route(1)fontawesome(1)소스코드빌드(1)git stash(1)리액트기본세팅(1)key stretching(1)input outline(1)selectrelated(1)VCS(1)로그인(1)promise(1)create react app(1)tutorial(1)decorator(1)js(1)frontend(1)MacOS(1)context(1)Sass(1)styled components(1)cors(1)

Typescript #6 인터페이스 (interface)

인자를 넘겨도 되고 안넘겨도 될때 ?로 표현한다.인터페이스에 지정한 프로퍼티이외에 값이 인자로 들어왔을때, js에서는 조용히 무시하고 넘어간다. 하지만 ts에서는 해당 프로퍼티가 없다는 오류가 발생한다.createSquare() 함수를 호출할때 이름을 colllor 로

2020년 5월 14일
·
0개의 댓글

Typescript #5 구조분해 Destructuring

타입스크립트에서 구조분해에 대해 알아보자.매개변수로 객체인 paramObj를 받는다.paramObj.a의 데이터 타입은 string,paramObj.b의 데이터 타입은 number이다. ? 는 b의 값이 있을수도 없을수도 있단 말처음 배열 구조분해보다 복잡시러워 졌다

2020년 5월 14일
·
0개의 댓글
post-thumbnail

Typescript #4 기본 데이터 타입

true / false 형태의 값위 예제 모두 number~' , " 작따옴표, 큰따옴표로 감싼 문자, 문자열백틱으로 감싼 ${변수} 를 포함 문자열도 해당배열 타입을 선언할때는 내부의 값의 타입도 선언해주어야 한다. 내부 인덱스의 값은 모두 동일한 타입이여야 한다

2020년 5월 14일
·
2개의 댓글

Typescript #3 React & Webpack 연결

typescript 한국어 문서 : react & webpack 보고 따라하기npm init -y : 초기화npm i -D webpack webpack-cli : 웹팩설치npm i react react-dom : 리액트, 리액트돔 설치npm i -D @types/rea

2020년 5월 14일
·
0개의 댓글

Typescript #2 REACT에서 사용하기

타입스크립트와 리액트 프로젝트를 시작한다면 아래와 같이 설치하자npx create-react-app <프로젝트명> --template typescriptnpm i typescript @types/node @types/react @types/react-dom @ty

2020년 5월 14일
·
0개의 댓글

Typescript #1 설치와 기본사용법

npm 또는 vscode extension 으로 설치한다.npm i -g typescript확장자는 .ts 를 사용하며 작업이 완료되면 .js 로 컴파일 하여여 사용해야 한다. tsc 파일명.ts 명령을 통해 .ts 파일 컴파일을 진행한다. 컴파일이 완료되면 파일명.j

2020년 5월 14일
·
3개의 댓글

GraphQL #5 apollo 서버 열기

플레이그라운드 열리는 것 까지 완료.

2020년 5월 13일
·
0개의 댓글

GraphQL #4 Root field & resolvers

obj: root 이전 resolver에게 받은 값args : 쿼리 필드에 제공된 인수. 키 이름context : 모든 resolver 함수에 전달되며, 현재 로그인한 사용자나 엑세스토큰 같은 정보를 보유하는 값.info : 현제쿼리, 스키마 정보와 관련되 필드 정보

2020년 5월 13일
·
0개의 댓글

GraphQL #3 Query

...재사용 가능한 graphql을 묶는다. 변수로 저장해두는 것처럼~반복되는 쿼리가 있을 경우 복잡해질때 사용할수 있다.대부분 인자는 동적이다. 때문에 입력받는 값을 인자로 넘기기위해 변수에 담아 사용한다.$변수명 변수이름 앞에는 $를 달면 변수로 인식한다.값이 tr

2020년 5월 13일
·
0개의 댓글

GraphQL #2 정리

Int : 정수Float : 실수String : 문자열Boolean : True/FalseID : id 임을 명시적 표현, 내부적으로는 String...스키마에 type를 정의할때 !를 함께 쓸때가 있다. !는 필수사항을 말한다. null로 받을수 없다.null이 들어

2020년 5월 13일
·
0개의 댓글
post-thumbnail

GraphQL #1 노마드코더 니꼴라스의 강좌 정리

니꼴라스와 함께하는 graphQL 강좌~ 게츠비로 사이트를 만들다 보니 graphql이 뭔지~ 궁금해서 듣는 니꼴라스의 유튭 무료강좌! 좀 옛날 강좌지만, 후딱 개념만 잡아보자아!프론트에서 요청한 것보다 많은 데이터를 응답하는 것, 매우 비효율 적이지! 데이터베이스에

2020년 5월 12일
·
0개의 댓글

github blog 배포하기(gh-pages & surge)

gatsby를 통해 프로젝트를 생성해주고, 깃헙에 업로드까지 진행했다.이제 남은 것은 사이트 배포하기! 그리고 나의 깃헙페이지 주소에 접속해보면 초기 세팅이 완료된다!배포전 npm run build 로 빌드하고 깃헙에 백날 백업해봐야 내 도메인으로 접속했을때 뜨는것은

2020년 5월 12일
·
0개의 댓글

github 파일 모두 삭제 후 초기 상태로 되돌리기

깃헙페이지 사용하면서 테마 이것저것 적용해보고 있는데,그때마다 페이지용 레포지토리 다시 생성하는게 너무나 귀찮고.. 이 방법이 맞는지 싶지만! 레포지토리 리셋하는 방법을 찾아봤다~리셋방법은 너무나 간단하다. 프로젝트 폴더로 이동한 뒤 명령어를 통해 .git 파일을 지우

2020년 5월 12일
·
0개의 댓글
post-thumbnail

github blog 생성하기 (feat. gatsby)

github blog 이전에 슬쩍 만들어둔 깃헙 블로그를 쓰지 않고 방치하고 있었는데, 쉬는 동안 블로그 스킨도 바꿔보고 어떻게 사용하는 건지 찬찬히 살펴보려 한다. create repository 먼저 깃헙 블로그를 위해 레포지토리를 생성했다. 레포지토리명은 아이디

2020년 5월 12일
·
0개의 댓글
post-thumbnail

CORS ....

...cors는 무엇인가...

2020년 4월 16일
·
0개의 댓글
post-thumbnail

backend django pip 패키지목록 만들고, 설치

pip 는 파이썬 패키지매니저로 말그래도 패키지, 모듈 등 관리해주는 관리 도구이다.pip를 통해 설치된 모듈과 버전을 볼 수 있다.가상환경에서 설치했다면, 해당 가상환경에 설치된 모듈 목록이 보여진다.보통 협업을 하게 되면, 모듈은 각자의 pc에 저장되어 관리하며 코

2020년 4월 16일
·
0개의 댓글

backend django 정참조 데이터 가져오기

Foreign Key를 갖는 테이블, 바라보는 테이블의 데이터를 가져올 수 있다.

2020년 4월 16일
·
0개의 댓글

backend django 역참조 데이터 가져오기

데이터베이스 테이블에서 Foreign Key(이하 FK)가 없고 다른테이블의 FK로 지정된 테이블일때, 나를 참조하는(나를 FK로 지정한) 테이블에 접근하는 것<현재테이블>.<FK인 user컬럼>.<역참조관계명>.all()UserProfile에서 내가

2020년 4월 16일
·
0개의 댓글
post-thumbnail

backend django JWT 발행하기

이번 포스팅은 백엔드에서 어떻게 JWT를 발행하고 확인하는지 알아보겠다. JWT를 알아보기 앞서 인증 & 인가에 대한 내용을 선행 하도록 하자! JWT(json web token)는 회원 로그인이 완료 되었을때 발행되는 토큰을 말한다. JWT에는 암호화 된 회원정보가

2020년 4월 14일
·
0개의 댓글
post-thumbnail

backend bcrypt 비밀번호 암호화 구현

회원가입시 프론트에서 전달받은 유저정보 중 비밀번호는 DB에 저장하기 전 암호화를 해주어야 한다. 어떤 과정을 거처 암호화가 되는지 알아보자. bcrypt는 비밀번호 암호화에 사용되는 알고리즘을 제공하는 라이브러리다. 알고리즘은 직접 구현해도 되지만, 예민한 주제이니

2020년 4월 14일
·
0개의 댓글