분류 전체보기 검색 결과

해당 글 159건
(회고) 짧지만 굵었던 3개월의 스터디

스터디의 참여 유지보수 팀에 있다보니 자기개발하기가 어려워 스터디에 참여하게 되었다. 스터디를 구한 곳은 개발자들의 커뮤니티인 OKKY. https://okky.kr/ OKKY - All That Developer okky.kr 자주 이용하는 곳이라 스터디도 쉽게 구할 수 있었다. 첫 스터디 처음 시작했을 때에는 이미 구축되었던 웹앱 프로젝트에 합류해서 실질적으로 내가 맡은 업무가 많지는 않았다. 프론트엔드로 준비하게되면서 타 개발자들의 코드가 매우 궁금했는데 스터디를 하다보니 참고할만한 코드들이 많았다. UI도 맘에 들었고, 같이하는 개발자분의 추진력이 매우 좋아서 개발을 빠르게 치고 나가기 좋았다. 새로운 프로젝트의 시작, 그리고... 그러나.. 아이템은 좋았지만 더 좋은 수익성을 위해 새로운 어플을..
Etc/Story 2021. 11. 9. 17:49
[error] Server is started at 5500 but failed to open in Browser Preview. Got Browser Preview extension installed?

vscode 에서 프로젝트 실행 시 Server is started at 5500 but failed to open in Browser Preview. Got Browser Preview extension installed? 에러 발생 에러 시 vscode 우측 하단에 이렇게 표시되어 있었음 문제해결 1. 단축키 Ctrl + Shift + X 를 사용하여 vscode 확장 프로그램으로 이동 2. 설정(톱니바퀴) 를 클릭하여 Extenson Settings 로 이동 3. Edit in settings.json 클릭 4. "liveServer.settings.useBrowserPreview": true -> "liveServer.settings.useBrowserPreview": false 로 변경 위 절차..
Front-End/JavaScript 2021. 11. 3. 15:01
(프론트엔드의 첫걸음) npm (node Package Manager) 란?

흔히 개발하면서 자주 접하는 npm 에 뜻해 대해 잘 알지 못하는 것 같아 공부 겸 정리해두려고 한다. NPM (Node Package Manager) 자바스크립트(JavaScript) 프로그래밍 언어를 위한 패키지 관리자이다. Node.js 에서 사용하는 모듈을 패키지로 묶어 npm 을 통하여 관리하고 배포하고 있는 것이다. 이 뜻을 다시 풀어 설명하자면, 다른 사람들이 만들어둔 모듈을 npm을 통하여 설치하고 사용이 가능하다는 것인데 앞에서 설명한 다른 사람들은 내가 될 수도 있다. 😊 1. npm 설치 node.js 다운로드 : https://nodejs.org/en/ 보통 안정적인 LTS 를 다운로드하는 편이다. window 에서는 위 사이트를 통해 다운로드하지만, mac 에서는 cmd 에 nod..
Front-End/Etc 2021. 10. 1. 11:23
(프론트엔드의 첫걸음) 바벨(Babel) 이란?

바벨 (Babel) 최신 자바스크립트 문법을 공부하면서 많이 들었던 단어가 바로 바벨(Babel) 이다. 그렇다면 바벨은 무엇일까? 바벨(Babel)이란, 입력과 출력이 모두 자바스크립트(JavaScript) 코드인 컴파일러이다. 바벨은 최신 버전의 자바스크립트가 실행되지 않는 구 버전의 브라우저에서 정상적으로 실행되도록 변환해준다. JavaScriptES6 에서 JavaScriptES5 로 변환해준다는 얘기다. 현재는 바벨을 사용하여 JSX 문법, 타입스크립트(TypeScript) 와 같은 정적타입의 언어와 코드 압축 등의 문법을 사용할 수 있다. 바벨(Babel) 실행하기 // npm init > npm init -y // 필요한 패키지 설치 > npm install @babel/core @babel..
Front-End/Etc 2021. 10. 1. 10:01
(프론트 엔드의 첫걸음) 브라우저 저장소에 대해 알아보자

브라우저의 저장소에는 종류에 대해 알아보자. 로컬 스토리지 (Local Storage), 세션 스토리지(Session Storage) 로컬 스토리지 (Local Storage) 는 HTML5 에 추가된 저장소이다. 간단한 키와 값을 저장할 수 있는 곳이며, KEY - VALUE 형태이다. 로컬 스토리지와 세션 스토리지의 차이점은 데이터의 영구성이다. 로컬 스토리지의 데이터는 사용자가 지우지 않는 이상 계속 남아있다. 세션 스토리지의 데이터는 사용자가 윈도우나 브라우저는 닫으면 제거된다. 자동로그인 등 지속적으로 필요한 데이터는 로컬 스토리지에 저장하고, 일회성 로그인 정보 등 잠깐 필요한 데이터는 세션 스토리지에 저장하면 됩니다. 로컬 스토리지 localstorage.getItem(); 세션 스토리지 s..
Front-End/Etc 2021. 9. 30. 16:36