Category: Web

0

Reactstrap – Bootstrap4를 React에서 사용하는 방법

현재 React 에서 Bootstrap 을 사용할 수 있게끔 제작된 프로젝트는 React-Bootstrap 과 Reactstrap 두가지가 있다. 본 글에서는 Bootstrap4 기반의 Reactstrap 을 소개한다. Reactstrap Jquery 기반의 Bootstrap 를 React 환경으로 이식한 프로젝트이다. 기존의 Div 엘리먼트에 Class...

8

비동기적 Javascript – 싱글스레드 기반 JS의 비동기 처리 방법

싱글 스레드 (Single-Thread) 로 작동한다고 알려져있는 Javascript 가 어떻게 비동기 작업을 통해 여러가지 Task를 동시에 처리하는지에 대해 알아보자. 특히 Promise 패턴, Async Await 를 제대로 이해하기 위해서는 꼭 공부하고 넘어가자. 비동기적 Javascript C, Java, Python 을...

0

Javascript map 메서드

map() 기존 존재하는 배열의 값들을 이용해서 새로운 배열을 만들어 내는 메서드이다. 배열의 요소를 일괄적으로 변경하는데 유용하며, 배열의 값에 접근할때 for 문과 같은 반복문을 번거롭게 사용하지 않아도 되는 장점이 존재한다. 배열의 메서드로 존재하며, 원래 배열의 각...

1

[node.js 기초] npm 소개 및 활용 ft. package.json

Node Package Manager npm은 Node Package Manaer 의 줄임말로써, Node.js 표준  패키지 관리 도구이다. Python의 pip이나 Ruby의 gem 처럼 모듈과 데스크톱 앱등의 Node.js 패키지들을 명령어로 손쉽게 관리 할 수 있다. npm install 명령을 사용하여, npmjs.com 에 존재하는...

0

node-cron을 사용하여 node.js에서 특정 작업에 스케줄 설정하기

Cron Cron 이란 원래 유닉스 계열 컴퓨터에서 특정한 작업을 시간기반으로 반복 실행하는 잡 스케줄러다. 특정 시간에 특정 작업을 꾸준히 실행해야할 일이 있을때 유용하게 쓰이는 기능인데, 해당 기능을 node-cron 이라는 모듈을 사용하여 node.js 에서도 사용할 수...

0

[node.js] Node.js 에서 MP3 메타 데이터 다루기

ID3 MP3 도 다른 파일들과 같이 음악의 정보를 담고있는 메타데이터가 존재한다. MP3파일은 ID3 라는 메타데이터 포맷을 사용하여 정보를 저장한다. 본 글에서는 node-id3 라는 모듈을 사용하여 Node.js 에서 ID3를 읽고 쓰는 방법에 대해 다룬다. 읽기 (Read)...

0

[CSS3] Media Query 를 사용하여 반응형 웹 만들기

개요 Media Query 는 CSS3 에 포함되어 있으며, 자바스크립트 등을 사용하지 않고도 특정 요소에 해상도별로 대응하는 스타일을 각각 적용시킬 수 있도록 해준다. 정확히는 Media Type 를 이용한 표현식을 통해 스타일의 적용 범위를 한정할 수 있다.  Media Query...

0

Geolocation API 를 이용한 디바이스 위치 정보 가져오기

HTML5 에서는 Geolocation라는 API를 지원한다. Geolocation API 를 사용하면 사용자의 디바이스가 위치하는 좌표를 간단하게 알아낼 수 있다. GPS가 내장 되어 있는 디바이스에서 가장 높은 정확성을 보인다. 개인의 실시간 위치 정보는 굉장히 민감한 개인정보 이기에 사용자의...

2

[Jquery] 특정 엘리먼트로 부드럽게 스크롤 이동하기

일반적으로 특정 타겟으로 스크롤을 이동시키기 위해서는 a태그의 href 속성에 #타겟의_ID 를 써주었다. 이렇게 간단하게 클릭 시 해당 타겟으로 스크롤을 이동되게 할 수는 있으나, 밋밋하다. 당장 L0GIC.me의 상단 고정메뉴의 버튼을 누르면 해당 섹션으로 부드럽게 스크롤이 되는 모습을...

2

HTML5 WebStorage API 사용하기

소개 HTML5에는 브라우저 자체에서 데이터를 저장할 수 있는 객체를 제공한다. 바로 Local Storage와 Session Storage 이다. 둘의 차이점은 단순히 Local Storage는 데이터의 유효기간이 존재하지 않고, Session Storage 는 웹브라우저 종료시 데이터가 소멸된다는 점이다. 그 외에는...