zoeful-coder

sessionStorage.setItem("name", "hello") 검사 > application > Session Storage > 주소 setItem에서 설정한 key : value값이 들어가있는걸 확인할 수 있다. localStorage.setItem("name", "hello") 검사 > application > Local Storage > 주소 setItem에서 설정한 key : value값이 들어가있는걸 확인할 수 있다. 차이점 Sessionstorage에 셋팅해준 값은 창을 닫으면 사라지는 값 Localstroage에 셋팅해준 값은 창을 닫아도 그 주소로 접속했을때 계속해서 그 값을 가지고 있음 set해준 값을 받아오기 sessionStorage. getItem("name") localS..

리액트는 무엇인가? “컴포넌트”라는 개념에 집중이 되어있는 라이브러리 데이터를 넣으면 우리가 지정한 유저 인터페이스를 조립해서 보여 준다. 생태계가 넓고, 사용하는 곳도 많다. 개발자가 원하는 스택을 맘대로 골라서 사용 할 수 있다. DOM기반으로 작동하는 페이지는 그때 그때 새로 뷰를 만들어버리라고 하면 성능적으로 엄청난 문제가 있을 것이다. 그래서 사용하는게 Virtual DOM *Virtual DOM이란? 변화가 일어나면, 실제 브라우저의 DOM에 새로운걸 넣는것이 아니라, 자바스크립트로 이뤄진 가상 DOM에 한번 렌더링을 하고, 기존의 DOM과 비교를 해서 변화가 필요한 곳에만 업데이트를 해줌. DOM 변화를 최소화 시켜주는 역할을 한다. (Vue에서도 사용한다.) 리액트 설치 및 사용 설치 np..

export로 변수, 함수, 클래스를 외부의 스크립트로 모듈화 시킬 수 있다. export { seoyeon, yoon }; - 한번에 여러개의 변수를 export export { seoyeon }; export { yoon }; - 한번에 한개의 변수를 여러번 export import … from …으로 모듈파일의 js를 가리키면 가져올 수 있다. import { seoyeon, yoon } from ‘./telephone’;

VueJS 2.0 스택오버플로우 질문 수 3379개 VueJS = 프론트엔드 자바스크립트 프레임워크 매우 작고 가벼움 시작하기 쉬움 다른 라이브러리와 프레임워크와 혼용하기 쉬움 메뉴얼이 타 프레임워크 / 라이브러리에 비해 한글화가 잘되어있음 Vue 와 react의 공통점 가상DOM을 사용한다. 컴포넌트를 제공한다. 뷰에만 집중을 하고 있고, 라우터, 상태관리를 위해 써드파티 라이브러리를 사용한다. *라우터란? *써드파티 라이브러리란? vue와 react의 성능차이 모든 시나리오에서 vue가 react보다 우수한 성능을 발휘 컴포넌트의 종속성이 렌더링 중 자동으로 추적되어 시스템에서 다시 렌더링 해야하는 컴포넌트를 정확히 알고 있다. 최적화 되지 않았거나, 최적화 되었을때도 vue가 react보다 빠르다...

프로젝트가 마무리 되가며 실제 운영하기 위해 브런치 작업을 해야한다는것을 알게 되었다. 이미 운영되고 있는 프로젝트에 추가 개발을 하다가 운영중 버그 사항이 발견되서 수정요청이 들어온다면 내가 작업하던 추가 개발코드를 다 지울 수 도 없는 노릇이기 때문에 동시에 다양한 개발을 하기위해서 브런치를 따는것이다. 기본적으로 git에 프로젝트를 올리게되면 master 브런치에 작업이 commit된다. master 브런치에 담긴 내용을 실제 운영에 반영될 내용이기 때문에 추가로 내가 개발하거나 수정할 사항들은 dev 브런치를 따서 작업하는것이 좋다. *새로운 브런치 따는 명령어 : $ git checkout -b dev Switched to a new branch 'dev' 라는 notice와 함께 내가 작업하던..

Nuxt.js를 이용해 주로 싱글페이지 웹 (Single Page Applications) 을 개발하다보면 서버쪽에서 api를 호출해 정보를 넘겨받거나 넘겨줄 일이 있는데 그럴때마다 너무 두렵고,, 어렵고,, 그냥 서버, API라고 하는 단어만 들으면 겁부터 나는듯하다 @_@ 그래도 일단 배운건 아는데로 정리를 해두는게 좋을듯하여 정리하쟈 정리!! express라는 NodeJS 웹 애플리케이션 프레임워크를 통해 클라이언트 요청에 응답할 수 있는 함수를 구현할 수 있다. const express = require('express'); const app = express(); 라고 선언해주면 app은 express의 인스턴스가 된다. app.get( "/test", ( request, response )=>..

프로젝트를 git에 올릴때마다 헷갈리는 부분을 간단하게 정리해 보려고 해요 : ) 1) 작업하던 프로젝트 폴더에 들어가서 git init 2) git add . 3) git commit -m "add local project" 4) git remote add origin https://주소입력 5) git push -u origin master

화면에 출력된 HTML 테이블을 엑셀로 export시킬 수 있도록 해달라는 요청사항을 받고 개발을 하던중 마주한 버그에 대해서 정리를 해보려고 해요. 저는 이런 버그가 있는줄 확인 못했는데 사실 오픈하고 나서 버그수정요청이 들어와 알게 되었네용 X( 조회 기간을 선택 후 ' 엑셀로 내보내기 ' 버튼을 누르면 테이블이 CSV파일로 다운로드 되도록 구현했던 로직이에요 ! 'click .excel-export-btn' : function(e,t) { t.list = [{...},{...},{...}...{...},{...},{...}]; let gridData = []; let initialValue = 0; (function() { for(let i=0; i