프론트엔드 검색 결과

해당 글 6건
(프론트엔드의 첫걸음) 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
(프론트 엔드의 첫걸음) 3. 브라우저 동작 원리

브라우저(Brower) 는 현재 가장 많이 사용하는 소프트웨어이다. 최근에는 파이어폭스, 사파리, 크롬, 오페라 등이 우세하다. StatCounter 브라우저 통계에 의하면 2021년 1월을 기준으로 크롬 63.63%, 사파리 19.37%, 파이어폭스 3.65% 를 차지한다. 오픈소스 브라우저가 시장의 상당 부분을 차지하는 것이다. 브라우저의 주요 기능 브라우저의 주요기능은 사용자가 선택한 자원을 서버에 요청하고 브라우저에 표시하는 것이다. 자원은 보통 HTML 문서지만 PDF 나 이미지 등의 형태일 수 있다. 자원의 주소는 URI (Uniform Resource Identifier) 에 의해 정해진다. 브라우저는 HTML 과 CSS 명세에 따라 HTML 파일을 해석하여 표시하는데 이 명세는 웹 표준화 ..
Front-End/Etc 2021. 2. 16. 16:00
(프론트 엔드의 첫걸음) 2. HTTP 란 무엇인가?

HTTP (HyperText Transfer Protocol) 텍스트 기반의 통신규악으로 인터넷에서 데이터를 주고받을 수 있는 프로토콜이다. 이렇게 약속을 정했기 때문에 모든 프로그램이 이 약속에 맞추어 개발하여 서로 정보를 주고받을 수 있게 되었다. HTTP 동작 클라이언트 (사용자) 가 브라우저를 통해 어떤 서비스를 URL 로 통하거나 요청(request) 를 하면 서버에서는 해당 요청에 맞는 결과를 찾아 사용자에게 응답(response) 하는 형태로 동작하는 것이다. 요청 (request) : 클라이언트 (client) -> 서버 (server) 응답 (response) : 서버 (server) -> 클라이언트 (client) HTTP 특징 TCP / IP 를 이용하는 응용 프로토콜이다. HTTP ..
Front-End/Etc 2021. 2. 15. 17:36
(프론트 엔드의 첫걸음) 1. 인터넷 작동 원리

인터넷은 웹의 핵심적인 기술이다. 인터넷의 가장 기본적인 것은 컴퓨터들이 서로 통신 가능한 거대한 네트워크라는 것이다. 단순한 네트워크 2개의 컴퓨터가 통신이 필요할 때, 우리는 다른 컴퓨터와 물리적(이더넷 케이블) 또는 무선(와이파이나 블루투스) 으로 연결되어야 한다. 이러한 네트워크는 2대의 컴퓨터로 제한되지 않는다. 원하는 만큼의 컴퓨터를 연결할 수 있다. 그러나 이렇게 연결할 수록 매우 복잡해진다. 마치 이런모습처럼 말이다. 이 문제를 해결하기 위해서는 네트워크의 각 컴퓨터에는 라우터라고 하는 특수한 소형 컴퓨터에 연결해야한다. 이 라우터에는 단 하나의 작업만 있다. 컴퓨터 B 에게 메세지를 보내려면, 컴퓨터 A 가 메시지를 라우터로 보내야 하며, 라우터는 메시지를 컴퓨터 B 로 전달한다. 이 라..
Front-End/Etc 2021. 2. 15. 17:16