꾸생의 DevLog

[HTML/CSS] 탭메뉴(TabMenu) 만들기

탭메뉴(TabMenu) See the Pen 20201231_탭메뉴 by junheeleeme (@junheeleeme) on CodePen. 자바스크립트(JS) Element.classList.add() Element.classList.remove() 제이쿼리(JQuery) Element.addClass() Element.removeClass() CSS menu1.on ~ board1{ display: block;} menu2.on ~ board2{ display: block;}

2020.12.31  

Node.js Query String Data 구하기

Node.js Query String Data main.js var http = require('http'); var fs = require('fs'); var url = require('url'); var app = http.createServer(function(request,response){ var _url = request.url; var queryData = url.parse(_url, true).query; var title = queryData.name; console.log(queryData); console.log(queryData.name); if(_url == '/'){ title = 'Welcome'; } if(_url == '/favicon.ico'){ response.write..

2020.12.30  

Node.js 웹 서버 만들기

Node.js 웹 서버 만들기 main.js var http = require('http'); var fs = require('fs'); var app = http.createServer(function(request,response){ var url = request.url; if(request.url == '/'){ url = '/index.html'; } if(request.url == '/favicon.ico'){ response.writeHead(404); response.end(); return; } response.writeHead(200); console.log( 'path : ' + url); response.end(fs.readFileSync(__dirname + url)); }); a..

2020.12.28  

Node.js 셋팅하기

Node.js 셋팅 1. Node.js 설치 Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 안정적인 LTS로 설치한다. 2. 코드 에디터 설치 A hackable text editor for the 21st Century At GitHub, we’re building the text editor we’ve always wanted: hackable to the core, but approachable on the first day without ever touching a config file. We can’t wait to see what you build with it. atom.io..

2020.12.28  

[JS/JQ] 티스토리 스크롤 상태 표시바 구현하기

스크롤 상태 표시 바 구현 웹사이트 스크롤 상태바를 구현해보려 합니다. 웹사이트를 돌아다니다가 스크롤 시 상단에 상태바가 표시되더라고요. 티스토리의 유명한 스킨에도 있는 것 같아 간단하게 HTML과 CSS, 자바스크립트를 사용하여 제 블로그에 구현해보려 합니다. 작업 순서는 아래와 같습니다. HTML 태그 삽입 태그 CSS속성 적용하기 자바스크립트로 기능 구현하기 1. HTML태그 삽입 태그 안에 상단의 태그 코드를 넣어주세요. 클래스는 'bar'로 지정했습니다. 잘 모르시는 분들은 저와 똑같이 위에 그대로 복붙 해주세요. 2. CSS속성 적용 .bar{ position: fixed; top: 0px; left: 0px; width: 0%; height: 5px; background: #98acf8; z..

2020.12.20  

[JAVA] 자바 프로그래밍 인터페이스(interface)

인터페이스(interface) 이전에는 코드가 구현하지 않은 메서드를 가지고 있는 추상(abstract) 클래스를 포스팅했다. 다음으로 배울 인터페이스는 모든 메서드가 추상 메서드로만 이루어져있다고 한다. 인터페이스를 어떻게 사용하는지와 인터페이스와 다형성의 관계를 포스팅하겠습니다. 인터페이스란? 인터페이스는 메서드 구현된 코드가 없는 추상 메서드와 상수로만 이루어져 있다. 구현된 코드가 없고 형식적인 선언만 있으므로 인스턴스로 생성이 불가능하다. 설계의 용도로 사용된다. 어떤 클래스가 특정 인터페이스를 사용한다면 그 클래스는 해당 인터페이스의 메서드들을 구현해야 한다. ▶ 인터페이스 생성 인터페이스는 따로 생성할 수 있으나 파일 확장자나 문법적인 변화가 크지 않으므로 기존 클래스에서 'class'를 '..

2020.12.16  

[JAVA] 자바 랜덤 함수 사용하기

자바 랜덤(Random) 함수 1. Random 클래스 사용하기 ▶사용방법 1. java.util.Random; import 시키기 2. Random 클래스 객체를 생성 3. 정수일 경우 nextInt() 메소드를 사용하여 파라미터에 범위를 지정 nextLong(), nextDouble(), nextBoolean()... import java.util.Random; Random rd = new Random(); int value = 0; for(int i = 0; i < 10; i++) { value = rd.nextInt(10); // 0~9 사이의 랜덤값 System.out.print(value + ", "); } 2. Math.Random() 사용하기 Random() 클래스 처럼 별도로 import..

2020.12.12  

[JAVA] 자바 프로그래밍 추상 클래스와 템플릿 메서드

추상 클래스와 템플릿 메서드 추상 클래스(abstract class) 추상 클래스는 추상 메서드를 포함하고 있다. 추상 메서드를 선언하는 이유는 자식 클래스가 추상 클래스인 부모 클래스를 상속받아서 사용하게 되는데, 부모 클래스에서 자식 클래스에 사용될 메서드의 코드 구현을 모르기 때문에 메서드 이름만 정의하고 코드 구현은 자식 클래스에서 이루어지는 것이다. 간단하게 말하자면 부모 클래스에서 하위 클래스에게 메서드 코드 작성을 위임했다고 해석하면 된다. 추상 클래스는 객체로 생성할 수 없다. 추상 클래스를 상속받는 하위 클래스는 상위 클래스의 추상 메서드를 구현할 책임이 있다. ▶ 추상 클래스 사용방법 public abstract class Computer { ..

2020.12.10