Velog Velog

지금 모각코 모임 사람들과 computer science 스터디를 진행하고 있다. 진행방식은 모임에서 만든 깃허브 계정에 레포를 하나 파고 자신의 저장소로 fork한 다음 로컬에서 작업한 것을 원본 레포에 풀리퀘 날리는 방식으로 진행한다. 정리할 겸 블로그에 동기화하는 방법을 포스팅하려고 한다. 먼저 fork한 레포를 내 로컬로 clone해온다. $ git clone https://github.com/sbyeol3/CS-study.git $ git remote -v 현재는 내 깃허브 계정의 원격 저장소와만 연결되어 있다. 원래 찐 원격 저장소와 연결을 해야 한다. $ git remote add upstream https://github.com/MOKAKMOKAK/CS-study.git 다시 확인해보면, ..

const [modal, setModal] = useState(false) hook을 이용해서 modal open 상태를 관리했다. 초기값은 false여서 모달이 보이지 않는다. {modal && } PlaceModal이라는 함수형 컴포넌트를 생성해서 props로 open 값과 closeModal 메소드를 넘겨주었다. import {Button, Fade, Select, Input, makeStyles, Modal, InputLabel, MenuItem, FormControl} from '@material-ui/core' import React, {useState, useEffect} from 'react' 모듈은 이렇게 사용했다. const useStyles = makeStyles((theme) => ..

제목 # 제목 1 ## 제목 2 ### 제목 3 #### 제목 4 ##### 제목 5 ###### 제목 6#의 개수만큼 ~ 을 표현할 수 있다. 줄바꿈은 띄어쓰기 2번 또는 태그를 사용 강조 기울임체 *Hello* -> Hello 볼드체 **World!** -> World! 취소선 ~~It's~~ -> It's 밑줄 MarkDown -> MarkDown 리터럴리 기호들을 쓰고 싶을 때는 백슬래시를 이용해서 탈출할 수 있음 코드 백틱을 이용 여러 줄인 경우에는 백틱 세개로 감싸주기 = ``` 코드 종류도 적을 수 있음 = ```javascript 리스트 인덱스가 있는 리스트는 숫자 + . 으로 표현 인덱스가 없으면 - * +으로 표현 들여쓰기를 통해 서브 리스트도 작성할 수 있음 이모지 마크..

https://www.vuemastery.com/courses/intro-to-vue-js Intro to Vue.js - Intro to Vue.js | Vue Mastery If you’re just getting started with Vue, here’s where to get going. We cover all the basics and give you challenges so you can learn by doing. www.vuemastery.com 1. The Vue Instance HTML 내에 데이터를 전달하여 사용하고 싶을 때 -> Vue를 이용한다 CDN 방식을 이용하여 HTML 내에 뷰를 삽입할 수 있다. product 위와 같은 태그들을 뷰를 이용해서 데이터를 전달하려면 먼저 V..

Geocoding 주소를 이용해서 주소의 위도와 경도값을 얻는 것 ex. 주소로 서울특별시 어쩌구 저쩌구를 입력하면 (****,%%^$$) 이런 식으로 리턴을 받는 것 Reverse Geocoding 위도와 경도값으로 주소나 거리같은 고유명칭을 얻는 것 geocoding은 유일값을 리턴받지만 reverse geocoding은 복수 개의 결과값을 얻을 수도 있다. 하나의 포인트가 길거리, 도시, 국가 등 여러 가지로 라벨링될 수도 있기 때문이다. https://developers.google.com/maps/documentation?hl=ko Google Map Api의 Maps JavaScript API를 이용해서 Geocoding을 하려고 한다. React로 개발하는 경우에는 'react-geocode..

Node.js 구글의 오픈소스 자바스크립트 엔진인 V8으로 빌드된 서버사이드 자바스크립트 언어는 C, C++, JavaScript로 개발되었다. 비동기식 프로그래밍이 가능하기 때문에 규모가 큰 서비스를 개발하기 좋은 소프트웨어 시스템 노드가 개발된 배경 기존 JSP와 같은 언어로 웹 어플리케이션을 개발한다면 일정한 메모리 공간을 사용하여 쓰레드를 생성해야 한다. 그렇다면 사용자가 많아질수록 서버를 추가해야 할 수 밖에 없다. -> 트래픽 비용의 과부하 또한 서버가 여러 대라면, 모든 서버들이 같은 데이터에 대해서 동기화되어 있어야 한다는 문제가 있었다. -> 이러한 문제를 해결하고자 노드가 개발되었다. 기존 멀티쓰레드 기반에서 벗어나 노드에서는 서버와 클라이언트의 연결을 하나의 이벤트로 처리된다. (메모..

지금 듣고 있는 수업이 그림이 많이 나오는 수업이라 깔끔하게 보기 위해서 갤러리 타입을 많이 사용하고 있다. 찾아보면서 알게 된 점을 간단하게 정리하려고 한다. 먼저 /(slash)를 입력하고 갤러리를 선택한다. Inline과 Full page가 있고 둘의 차이는 아래와 같다. Inline을 선택하면 그림들을 생성한 페이지 그 내부에서 그림을 볼 수 있고, Full page인 경우는 해당 페이지로 이동하게끔 블록이 생성된다. 나는 내 필기 내에서 그림을 보고 싶기 때문에 Inline 타입을 주로 사용한다. 원래 갤러리 카드 크기가 커서 좀 균형이 안맞게 보이는 거를 고치고 싶었다. 방법은 아래를 따라하면 된다. 여기서 Card size를 조절해주면 된다! Card Preview를 cover나 none으로..

깃허브에 자주 커밋을 하게 되면서 언젠가 커밋 메시지를 정해야지 생각만 했다. 드디어 오늘 컨벤션을 정하고 그거대로 쓰려고 해야겠다. 해당 포스팅은 아래를 참고했습니다. https://djkeh.github.io/articles/How-to-write-a-git-commit-message-kor/ 규칙 1. 타이틀 첫 글자는 대문자로 시작하기 feat : @2#$$ -> Feat : ~ !3#$$ 규칙 2. 시제 없이 명령문으로 작성하기 (동사원형) Feats : @#$%% -> Feat : ~@#^^ 규칙 3. 커밋 타입은 아래에 맞추어 작성하기 Feat : 코드나 테스트를 추가했을 때 Fix : 버그를 수정했을 때 Remove : 코드를 제거했을 때 Update : 코드보다는 문서나 라이브러리 등을 ..