JS
프로그래머스 바닐라 JS 스터디 - 1주차
프로그래머스 바닐라 JS 스터디 - 1주차
2021.05.30시작 프로그래머스에서 참여형 유료 스터디로 바닐라 자바스크립트를 수강하게 되어 공부하며 미흡했던 내용을 정리하고자 합니다. Map vs Reduce Map의 경우에 Array.map((요소, 인덱스, 배열) => { return 요소 }); 실행하는 배열과 결과로 나오는 배열이 서로 다른 객체가 됩니다. 즉, 배열을 1대1로 매핑하게 되기 때문에 기존 객체를 수정하지 않는 메소드라고 정리할 수 있습니다. Reduce의 경우에는 Array.reduce((누적값, 현재값, 인덱스) => {return 결과값}, 초기값) 의 구조로 사용할 수 있습니다. 일반적으로 Reduce는 누적값을 구하는데 사용할 수 있지만, 데이터를 조회하며 리듀스 함수(콜백함수)를 실행합니다. 이를 통해 배열 형태에서 원하는 형태로 ..
express, babel 설치
express, babel 설치
2021.05.25npm i express npm은 패키지 관리 도구입니다. 프로젝트에서 요구하는 서버를 구현하기 위해서는 express 를 설치해 줍니다. express 설치 후, node_modules에서 express > lib 에서 package.json을 확인할 수 있습니다. dependencies 등등 확인해볼 수 있습니다. express의 package.json 파일의 scripts 부분 입니다. 보고 있는 이유는 scripts에는 어떤것이 정의되었는지 확인해보고자 했습니다. 또, dependencies 입니다. 이 express를 실행하려면 반드시 설치해줘야 하는 의존성 패키지들 이라고 생각하시면 좋을 것 같습니다. npm i 시에 package.json의 express의 버전을 package-lock.js..
JS06 :: 바닐라 JS 프로젝트(2)
JS06 :: 바닐라 JS 프로젝트(2)
2021.05.22이전 바닐라 JS 프로젝트에서 배경화면을 변경하여 나만의 앱을 생성해보겠습니다. 정적인 화면을 구성하는 index.html 에서 배경화면 처리를 위한 script를 등록하겠습니다. index.html에서 weather.js 를 등록해줍니다. index.html bg.js image는 총 3장을 준비하였습니다. 오리 3총사 image 객체를 생성하고 나면 css의 선택자 class를 포함시키고, body 태그에 해당 tag 를 prepend 하게 됩니다. body 안에 image 가 잡히게 됩니다. (css에서 z-index = -1 로 잡았기 때문에 현재 맨 뒤로 가있는 상태입니다.) 이 다음 코드인 weather.js 구현해야 하는데 현재 위치 좌표를 받아오지 못하고 있다. mac에서 위치 좌표를 설정..
완주하지못한선수 / k번째 수
완주하지못한선수 / k번째 수
2021.05.08Javascript로 두 문제를 풀어보았습니다. 관련해서 Javascript 문법이나 특이점을 정리해보고자 합니다. 1) 완주하지못한선수 HashMap을 사용해서 해결할 수 있는 문제였는데 Javascript에서 HashMap을 정의할 때 아래와 같이 사용합니다. HashMap에 데이터를 삽입한 후 for loop으로 데이터를 조회할 때에는 아래와 같이 사용합니다. 이 문제에서는 특별한 로직이 필요없습니다. 여러 풀이법이 있겠지만 HashMap을 이용하면 쉽게 접근할 수 있습니다. Code 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 function solution(participant, completion) { var ans..
JS03 :: node.js 버전 관리
JS03 :: node.js 버전 관리
2020.08.25n 은 Node.js 버전을 관리해주는 플러그인입니다. $node -v 우선적으로 node 버전을 확인합니다. $ sudo npm install -g n n모듈을 설치합니다. node버전에 따라서 다음 3가지로 분류합니다. 1. 최신버전, 2. 안정버전, 3.LTS버전 1. 최신버전 $ n latest 2. 안정버전 $ n stable 3. LTS버전 $ n lts
SSATUBE03:: dev 2019.12.12 - 개발 공부
SSATUBE03:: dev 2019.12.12 - 개발 공부
2019.12.14Javascript JS 는 브라우저에 내장되어 있다. JS를 이용해서 서버를 만들 수 있고 웹 스크랩터를 이용해서 웹 크롤링도 가능하게 한다. 브라우저 밖으로 꺼내서 사용한다. JS를 이용해서 브라우저와 별도로 작동하는것을 만든다 Node.js다. node.js는 철저하게 es6기반 JS 가 비동기로 동작하기 때문에 실시간처리가 가능하다. 내 경우 MAC이라 1.3 installing nodejs Brew update node 실행 했다. Node -v 로 하면 버전 표시가 나온다. 서버를 만들어보자. 서버란 컴퓨터다. 소프트웨어적 서버 = 인터넷에 연결된 덩어리 코드 물리적인 컴퓨터 = 공개적인 컴퓨터 접속 요청에 응답하는 컴퓨터이다. 서버란 접속을 받아주는 무언가다. 접속을 Listen 하고 있습니..
Web02 :: Front-end 와 Back-end
Web02 :: Front-end 와 Back-end
2018.12.31웹 프론트 엔드 - 웹을 통해 다양한 콘텐츠를 제공한다. 리소스, 웹 컨텐츠 제공한다. 사용자가 요청 반응해서 웹 동작한다. 웹 브라우저에서 처리한다. 웹 프론트 엔드 역할 - 구조를 만들어야 함. 신문 책 처럼 적절한 배치를 해야한다. 일관된 디자인 이어야 한다. 가독성 중요함 HTML, CSS, JavaScript클라이언트 수행할것을 해준다. 도구더보기 - 개발자 도구element pannel 계층적으로 표현하게 된다. 자바스크립트는 동적인 부분을 담당한다. 12345678 우리집에 오신걸 환영합니다 위치 경기도 시흥시 어딘가 위치하고 있어요~ 특징 우리집은 마루가 아주 작아요~ 하지만 옹기종기 모여있기 좋은 구조에요email : crong@kdd123.comcs 스타일 - CSS 코드예시웹페이지를 ..