목록생활코딩 (19)

song.log

[React] 리액트 컴포넌트(Component)제작, 인스턴스 속성(props)의 사용법, React Developer Tools

1. 컴포넌트(Component) 제작 리액트로 만들어지는 앱을 이루는 최소한의 단위로 공식 문서를 보면 자바스크립트의 함수 역할을 맡은 존재와 같다. 컴포넌트는 React의 Component 객체를 상속하는 클래스를 생성해서 export하는 App에 태그화 하여 작성하면 클래스의 html 코드를 구현할 수 있다. import React, { Component } from 'react'; import logo from './logo.svg'; import './App.css'; class App extends Component { render(){ return ( ); } } class Subject extends Component{ render(){ return ( WEB World Wide Web )..
DevLog/React & Redux 2020. 1. 6. 15:29
[React] 리액트 개발환경 설정, create-react-app을 이용해서 개발환경 구축, Hello React

React(리액트)는 자바스크립트로 만들어진 프레임워크로 Facebook UI Library이다. 기존의 프론트언어가 아닌 리액트를 사용하고자 하는 이유는 대부분 아래와 같다. 1. 가독성 2. 재사용성 3. 유지 / 보수 용이 1. create-react-app을 이용해서 개발환경구축 1. npm 설치 npm install -g create-react-app ※ 오래된 버전의 경우 더이상 템플릿을 지원해주지 않는 경우가 있다. 최신 버전으로 깔아야 템플릿을 받을 수 있다. A template was not provided. This is likely because you're using an outdated version of create-react-app. Please note that global ..
DevLog/React & Redux 2020. 1. 2. 15:56
[MySQL] Node.js MySQL 모듈의 기본 사용법, MySQL로 CRUD기능 구현

1. VScode를 통해 Node.js - MySQL 연동 먼저 VScode의 Terminal에서 mysql monitor에 접속 이후 작업은 터미널을 왔다갔다 하면서 사용할 수 있게 된다. mysql npm을 설치 npm install -s mysql 여기서 -s를 붙이는 이유는 dependencies 목록에 추가하기 위함 nodejs > mysql.js 파일을 생성 mysql을 연동하기 위한 코드작성 var mysql = require('mysql'); var conn = mysql.createConnection({ host : 'localhost', user : 'root', password : 'password', database : 'example' }); conn.connect(); conn...
DevLog/MySQL 2019. 12. 31. 20:42
[MySQL] Workbench 설치 & 사용법

1. mysql workbench를 검색하고 설치 만약 비밀번호를 저장한 상태로 사용하고자 한다면 + 버튼을 눌러서 정보를 입력해야한다. 1) Connection Name 설정 2) Connection Method : TCP/IP 3) Hostnname : 127.0.0.1 또는 localhost 4) Password: 비밀번호 저장을 하고자 한다면 Store in Vault.. 데이터베이스를 더블클릭하면 QUERY문을 작성할 수 있는 창이 생성되고, 거기에 QUERY문을 작성하고 번개 표시를 클릭하면 Result Grid에서 결과를 확인할 수 있다. 참조한 생활코딩 URL : https://opentutorials.org/module/3300/19548
DevLog/MySQL 2019. 12. 30. 22:09
[MySQL] Schema(스키마), Table(테이블) 생성

1. DATABASE/SCHEMA 생성 & 삭제 CREATE DATABASE example; DROP DATABASE example; 2. DATABASE 목록 조회 SHOW DATABASES; 3. DATABASE 사용/업데이트 USE example; 4. TABLE 생성 세미콜론이 없는 상태에서 엔터를 누르면 개행할 수 있고, 콤마를 잊었을 경우 엔터 후 콤마를 추가해주면 된다. MySQL에서 쓰이는 Data Type 참조 사이트 : http://www.mysqltutorial.org/mysql-data-types.aspx 참조한 생활코딩 URL : https://opentutorials.org/module/3300/19535 https://opentutorials.org/module/3300/195..
DevLog/MySQL 2019. 12. 30. 21:40
[MySQL] MySQL 설치 방법(공식사이트/bitnami), MySQL의 구조, 서버접속

1. 구글에 'mysql community edition download' 를 검색 후 설치 순수하게 무료버전은 'community edition' 운영체제에 맞는 프로그램으로 다운로드 설정하고자 하는 비밀번호를 넣어주면 된다. 모든 설치가 완료되면 mysql이 실행된다. 설치완료 후 환경변수를 설정하러 가야한다. (제어판>시스템 및 보안>시스템>고급 시스템 속성> 고급 > 환경 변수 시스템 변수 > path를 더블클릭하거나 편집 버튼 클릭 환경 변수 편집에서 새로만들기를 눌러 새로운 경로 생성 경로는 mySQL 실행파일이 있는 곳을 복사하여 넣어준다. 윈도우키 + r > 실행창 cmd > mysql -uroot -p 로 비밀번호를 입력했을 때 아래와 같은 창이 나오면 환경변수 설정이 제대로 된 것이다...
DevLog/MySQL 2019. 12. 30. 20:43
[Node.js] Express : Router(라우터) , 보안 , Express-generator

1. Router 현업에 종사하다보면 Route가 엄청난 갯수를 이룰 때가 많다. 그렇다 보면 이를 보다 깔끔하게 정리하여 보는 것이 효율적일 때가 있다. 그 역할을 Router가 하는 것이다. 주소체계을 변경하여 Router를 만들 준비를 한다. 먼저 경로앞에 들어갈 키워드를 넣어 그룹화 한다. Router라는 새로운 폴더를 생성해주고 그 안에 topic이라는 파일을 생성한다. 여태까지 routing 했던 것을 topic.js 파일로 옮긴다. topic.js 파일에는 아래의 형식과 기존의 코드의 그룹화 한 것을 합쳐준다 var express = require('express'); var router = express.Router(); module.exports = router; app.use(expre..
DevLog/Node.js 2019. 12. 30. 19:12
[Node.js] Express : 미들웨어(Middleware) 만들기, 실행 순서, 사용법

1. Middleware 만들기 코드를 짤 때, 공통적으로 사용되는 부분이 겹칠 때, 그 함수를 middleware로 만들어서 사용하는 것이 가능하다. middleware의 형태는 다음과 같다. 여태까지 짠 main.js파일에서는 폴더 내의 파일 리스트를 읽는 작업을 반복적으로 했는데, 그 부분을 middleware로 만들어서 활용하는 것이 가능하다. app.use(function(request, response, next){ fs.readdir('./data', function(error, filelist){ request.list = filelist; next(); }) }); app.get('/', function(request, response) { fs.readdir('./data', funct..
DevLog/Node.js 2019. 12. 23. 22:54
Prev 1 2 3 Next