본문 바로가기

전체 글

(56)
[git] github 기존 저장소 변경 https://mollang.herokuapp.com/ React App mollang.herokuapp.com 위 링크에 연동되어 있는 git 저장소 명칭을 바꾸고 싶다. 기존 저장소는 https://github.com/ksy8230/aaa 바꾸고 싶은 저장소 https://github.com/ksy8230/bbb (1) cmd 창에서 해당 프로젝트 로컬 경로로 이동한다. (git remote -v 라는 명령어로 현재 (바뀌기 전) 기존 저장소 명을 체크할 수 있다) (2) git remote set-url 명령어를 사용하여 저장소 url 변경 (ex git remote set-url origin https://github.com/ksy8230/bbb)
[js] promise 이해하기 + 객체 프라미스를 쓰는 이유 : 비동기 처리를 순차적으로 실행할 필요가 있는 경우 비동기 처리를 중첩해서 표현하므로 ex. 1초 뒤에 'a' 2 초 뒤에 'b' 3 초 뒤에 'c'... setTimeout(function(){ console.log('a') setTimeout(function(){ console.log('b') setTimeout(function(){ console.log('c') },1000) },1000) },1000) 에러, 예외처리가 어렵고 중첩으로 인한 가독성이 떨어진다. 그래서 생겨난 것이 프라미스. "비동기에서 성공과 실패를 분리해서 메서드를 수행한다" var loading = function (path) { return new Promise (function (resolve, re..
[js] callback 함수 이해하기 callback 함수를 쓰는 이유 : 비동기 처리를 위해 동기와 비동기의 차이 : 동기란 파일 조작이 완전히 끝난 후 다음 동작이 이루어지는 방식이고, 비동기란 다음 코드를 진행하면서 파일 조작을 하는 방식이다. : 어떤 루틴을 완전히 끝내고 제어를 반납하면 동기식, 동작이 안 끝났어도 일단 제어권을 반납한 후 지 할일 계속하면 비동기식. 일상 예제 중 이런 게 있는데 이해가 갔다. ex) 1. 남자가 여자에게 10 분에 한번씩, "준비 다 됐음?" 하고 물어보고 준비 다 됐을 때 데이트를 하러 가는 것 2. 남자가 여자에게 "준비 다 되면 문자해" 하고 근처 피시방에서 게임하고 있다가 문자가 오면 데이트 하러 가는 것 비동기 프로그래밍을 하는 이유 : 속도 때문에 동기 프로그래밍은 기능을 요청한 후, ..
[react] state, componentDidMount 목표: loading 텍스트가 3초 뒤에 we are ready 로 바뀌는 화면 리액트를 시작할 때 보이는 기본적인 코드 구조는 아래와 같다. import React, { Component } from 'react'; import './App.css'; class App extends Component { render(){ return {isLoading ? "Loading..." : "we are ready"} } } export default App; 리액트는 자바스크립트 기반의 모듈이기에 div 속 { } 에 함수를 넣어줄 수 있다. { isLoading ? "Loading..." : "we are ready" } isLoading 이 true 이면 Loading... 을 화면에 찍어주고, fals..
[heroku] nodejs로 만든 페이지 (Heroku)헤로쿠에 올리기 * 우선 express란 무엇인가? Express.js는 nodejs의 핵심 모듈로 http 와 connect컴포넌트(?) 를 기반으로 하는 웹 프레임워크이다. 일단 큰 맥락으로 내가 하고 싶었던 건 nodejs를 이용해 heroku라는 클라우드 서비스에 배포하는 것. (로컬 서버가 아니라 외부에 공유가 가능하다는 점에서, 단기 프로젝트에 유용하다는 점에서 좋다고 한다. 매월 550시간 가능. 히로쿠를 쓰는 용도는 좀 더 검색을 해볼 것.) 1. 히로쿠에 가입 http://www.heroku.com Cloud Application Platform | Heroku Heroku is a platform as a service (PaaS) that enables developers to build, run, ..
[작업물] 해당 칸에 맞게 움직이는 네비게이션 슬라이드 https://shop.adidas.co.kr/html/adidas/2019/event/vrct/build/index.html 아디다스 공식 온라인 스토어 인기 NOT SPORTS SPECIFIC 47,200원 59,000원 shop.adidas.co.kr html 패치에 담긴 그들만의 한 마디 SON NA EUN POTENTIAL JAMES HARDEN FAMILY NING ZETAO BRAVE METTE TOWLEY AUTHOR PAULO DYBALA SACRIFICE DENISE SCHINDLER I’M PERFECT scss .slider_wrapper { width: 100%; background: #fff; // overflow: hidden; .slider_wrap { margin: 0 au..
[css] 올바른 css 네이밍 css 네이밍은 기본적으로 하이픈(-)으로 구분된 문자열을 사용한다. 하이픈 규칙의 올바른 예 .red-box { border: 1px solid red; } 체계적인 css 네이밍 규칙을 쓰면 class 이름만 보고 무엇을 하는지 / 어디서 사용하는지 / class 들과의 관계를 알 수 있다. BEM 네이밍 규칙 B : BLOCK E : ELEMENTS M : MODIFIERS B 라는 큰 그룹 아래로 E 라는 요소들이 있고, 이 요소가 갖고 있는 수식을 M이 지정했을 때 .stick-man__head--small { } .stick-man__head--big { } 큰 그룹인 .stick-man 이라는 클래스는 하이픈 형식으로 stick-man 이 갖고 있는 하위 요소인 head, leg, arm 등..
[js] var / let / const 변수의 차이 var 라는 변수는 function 범위(scope)를 갖고, let, const 라는 변수는 block 범위(scope)를 갖는다 let과 const 로 선언된 변수는 블록 레벨 스코프를 가집니다. 즉, {} 내부에 변수를 선언하면 해당 블록 내부에만 생명주기를 유지합니다. 반대로 var는 함수 레벨 스코프를 가지므로, 블록 내부에 선언되어도 외부에서 접근할 수 있습니다. 1. var *호이스팅이란? 후선언된 변수나 함수들이 해당 범위에서 최상위에 위치하는 걸 의미. 즉, 선언이 잘못되었어도 자바스크립트에서 이를 올바르게 코딩된 것처럼 인식. // var는 function-scope이기 때문에 for문이 끝난다음에 j를 호출하면 값이 출력이 잘 됨 // 이건 var가 hoisting이 되었기 때문이다...