Root
👉 오버로딩 객체의 메소드를 중복정의하는 것 ( 여러개 만들기 ) ( 이름은 같지만, 인자는 다른 메소드 만듬 ) // 이름은 같지만, 인자의 유형과 개수가 다른 메서드를 만들 수 있다. class Post { def test(one, two) { ... } def test(A, B, C) { ... } } 오버로딩의 장점 매개 변수의 생김새에 따라서, 다른 메서드가 호출되게 만들 수 있다. ( 유동적인 메서드 호출 ) - 그냥 다른이름의 메서드를 사용하는 것이 낫지 않나? 👉 오버라이딩 객체의 메소드를 재정의하는 것 ( 새로 덮어쓰기 ) ( 부모객체의 메소드를 무시하고, 새로운 메소드 만들기 ) // Post 객체 class Post { def test() { ... } } // Post 객체의 자식인..
luxon 란? 날짜, 시간 관련 기능을 처리하는 Node.js 패키지 luxon 설치 npm i luxon luxon 사용법 현재시각 가져오기 import {Datetime} from 'luxon' console.log(Datetime.now()) JS Date객체를, luxon Date객체로 바꾸기 fromJSDate() 메소드를 사용한다 import {Datetime} from 'luxon' const jsDate = new Date() console.log(Datetime.fromJSDate(jsDate)) luxon Date객체가, 현재 시각부터 얼마나 전인지 확인하기 toRelative() 메소드를 사용한다 import {Datetime} from 'luxon' const preDate = ..
HTML에서 이미지 파일 넣기 HTML은, base64 인코딩 방식으로 이미지를 넣을 수 있다. React Native에서 이미지 파일 넣기 const img = require('./bg.jpg'); Node.js API인 require는, 파일이 이미지라면, base64로 인코딩해준다.
react-native-paper란? React native에서, UI 색상을 쉽고 세련되게 꾸밀 수 있도록 도와주는 Node.js 패키지 React Native Paper React Native Paper is a high-quality, standard-compliant Material Design library that has you covered in all major use-cases. reactnativepaper.com react-native-paper 설치 npm i react-native-paper react-native-paper 사용하기 Colors 객체에서, 색상 정보를 꺼내 사용한다. ( 파란색 - Colors.blue500 ) 500 : 주색상 200 : 주색상의 연한 버전 70..
React는 javascript로 이루어져 있으므로, 홈페이지를 꾸미기 위해서는 CSS엔진이 필요하다 Yoga - css엔진 (C++로 구현됨) Yoga엔진은 기존의 css엔진과 비슷하나, 약간의 차이점이 존재한다. 기존엔진 justify-content : center Yoga엔진 justifyContent : center React Native에서 컴포넌트 꾸미기 (스타일링) 1. 뷰 컴포넌트 이름에 View가 들어간 컴포넌트는, backgroundColor 속성을 사용해 배경색을 지정할 수 있다. 2. 텍스트 컴포넌트 Text 컴포넌트는, color 속성을 사용해 글자색을 지정할 수 있지만, 배경색은 지정할 수 없다 인라인 스타일로 꾸미기 인라인 : 컴포넌트의 기본속성인 style을 이용해, 컴포넌..
Pyscript란? HTML에서 python을 사용할 수 있도록 해주는 라이브러리 Pyscript.net Run Python code in your HTML. pyscript.net Pyscript의 원리 Pyodide - CPython의 포트, WebAssembly로 컴파일된 인터프리터 WebAssembly - 바이너리 포맷의 웹이 이해할 수 있는 기계어
ws란? 클라이언트와 서버사이의 Websocket 통신을 하게 해주는 Node.js 패키지 ws 설치 npm i ws express와 합치기 ( http + websocket ) import http from 'http' import {WebSocket} from 'ws' /* import express from 'express' const app = express() const server = http.createServer(app); */ const server = http.createServer(); // http 서버 만들기 const wss = new WebSocket.Server({ server }); // 웹소켓 서버 만들기 function handleConnection(socket) { c..
WebSocket이란? HTTP와 같은 데이터 송수신 규칙(프로토콜) WebSocket의 특징 첫 요청과 응답 이후로는, server가 user에게 데이터를 보낼 수 있다. ( HTTP는 사용자의 요청없이, 데이터를 받아올 수 없다. ) WSS ( Secure Web Socket ) WebSocket 작동방식 브라우저가 서버로 웹소켓 요청을 보냄 서버가 웹소켓 요청을 승낙 or 거절하여 응답 요청과 응답이 한번 성립되면, 연결이 성립(establish) 된다. ( 유저정보 기억 ) 브라우저의 요청없이, 서버가 브라우저로 데이터를 보낼 수 있다.
Pug란? javascript를 사용하여, HTML을 렌더링해주는 템플릿 엔진 Pug 설치 npm i pug Pug 작성법 html에서 기호가 제외된다. 요소와 같은 줄에 있는 것을 태그로 감싼다. 태그에 속성을 넣을때 괄호()를 사용한다. - 태그(속성=값) 태그뒤에 .을 붙혀 클래스를 추가할 수 있다 - 태그 .class 태그뒤에 #을 붙혀 id를 추가할 수 있다 - 태그 #id 들여쓰기로 부모요소와 자식요소를 나눈다. Pug와 express 연결 // src/app.js app.set('views', path.join(__dirname, 'views'); app.set('view engine', 'pug'); // src/views/home.pug doctype html html(lang="en")..