개요 Redux는 어렵게 생각할 필요 없이, 3단계로 이루어져있다. 설 명 Action 상태 변경을 일으키는 이벤트에 대한 정적인 정보로서, 대부분 객체 형식으로 이루어져있다. Reducer Action을 받아, 어떻게 수행할지를 정하는 함수 Store State를 관리하는 장소 예제로 살펴보기 아래는 간단하게 JS에서 테스트해본 것이다. // 테스트에서는 CDN으로 불러오는 방식을 사용했다. // const Redux = require('redux'); // 리듀서 const myReducer = (state = 0, action) => { switch(action.type) { case 'add_number': return state + 1; case 'minus_number': return stat..
Redux는 해도해도 헷갈리는 느낌이기에, 한 번 정리해보려 글을 작성한다. React에서 이야기하는 상태는 무엇을 의미할까? React에서 사용되는 상태(State)란, 컴포넌트 내 존재하는 변수를 의미한다. React는 Vue나, Angular와 다르게 데이터가 한 방향으로 흐르는 단방향 바인딩 방식인데, 이는 Props drilling을 발생시킨다고 한다. Prop Drilling이란, '리액트의 컴포넌트 트리에서 데이터를 전달하기 위해서 필요한 과정' 이라고 하는데, 쉽게 풀이해보자면 React 내에서 상탯값을 전달하기 위해 하위 컴포넌트를 계속 타고 가는 과정이라고 생각하면 된다고 한다. 결국, 상태 관리 라이브러리는 이러한 Props drilling을 방지하기 위해 사용한다고 보면 된다. 상태..
이전 내용을 확인하고 싶으시다면, 아래 링크를 눌러주세요. 1. Webpack이란 무엇인가? 이전부터 Front-end 개발 업무를 할 때 코드를 수정하고 저장한 뒤 브라우저를 새로고침해서 확인하거나, 웹 서버에 배포할 때 HTML, CSS, JS 및 이미지 압축, CSS 전처리기 반환 등의 작업을 해야 했다. conative.tistory.com Webpack이 뭔지 대충 알았으니, 이제 본격적으로 Webpack을 적용해 보겠다. $ mkdir webpack_test $ cd webpack_test $ npm init -y $ npm i webpack webpack-cli css-loader style-loader mini-css-extract-plugin -D 아래 파일들은, 루트 경로에 작성한다. ..
이전부터 Front-end 개발 업무를 할 때 코드를 수정하고 저장한 뒤 브라우저를 새로고침해서 확인하거나, 웹 서버에 배포할 때 HTML, CSS, JS 및 이미지 압축, CSS 전처리기 반환 등의 작업을 해야 했다. 이는 너무 불편했기에 자동화해주는 도구가 필요해졌고, 그래서 Webpack과 Gulp가 생겨나게 되었다... 들어가기 전에... Webpack에 들어가기 전 간략하게 짚고 넘어갈 사항이 있는데, 바로 npm install 에 대한 내용이다. (사실 많이 봤는데도 헷갈려서 적어놓았다.) // package.json - dependencies // Application에 직접적인 연관이 있을때 사용, Build 시 자동으로 설치됨 npm i eslint // package.json -devD..
추후에 다시 확인해볼 예정이라는것 사용 서버: Centos 7.7v, Docker Docker 설정 # failed to get D-bus connection 문제 해결 $ docker run --privileged -d --name myblog centos:7.7.1908 /sbin/init $ docker exec -it myblog /bin/bash SSH 사용 Setting # SSH 시작을 위한 세팅 $ yum update -y $ yum install openssh-server # 설치 확인 $ rpm -qa | grep -i openssh-server # ssh config $ vi /etc/ssh/sshd_config # 주석 제거 PORT 22 LoginGraceTime 2m# 사용자 인..
이전 코드까지는 try-catch 문을 사용하여 에러를 잡아내고, Catch에서 반복적으로 Log 저장과, 에러 처리를 반복적으로 진행하였다. // Old service import { getConnection } from "typeorm"; import { guestBooksRepo } from "../model/repository/guestBookRepo"; async function findAll() { try { const connection = getConnection(); const guestRepoData = connection.getCustomRepository(guestBooksRepo); return await guestRepoData.findAll(); } catch(err: unkn..
개요 PHP 4.0 └ PHP 3.0 + 프레임워크(Zend 엔진) └ 모듈화 및 웹 서버 인터페이스 부문이 추가되었다. └ 이식성 측면이 상향되었다. PHP 5.0 └ 객체지향 문법이 추가되었다. ( PHP 3.0/4.0 버전에서는 Class를 만들고, 상속받는 기능 외엔 없었음) └ xml 지원이 강화되었다. └ SQLite 등 sql이 확장되었다. └ Tidy 확장을 지원하였다. (이를 통해 HTML 문서를 표준에 맞게 관리할 수 있음) PHP의 장점 ① 무료다. (고급 기술은 유료지만..) ② 플랫폼에 독립적이다. ③ PHP 내부 소스 코드를 수정할 수 있다(고수용) ④ 웹 개발에 적합하다(C, Java는 애시당초 웹 개발 용이 아니였다.) ⑤ 에러를 무료로 해결이 가능하다(?) ⑥ 대중적이다. ..
$_Files 안에 뭐가 들어있는지 먼저 확인해보자 var_dump($_FILES); // name : 실제 이름 // type : 이미지, png타입이다 // tmp name : 임시 이름 - 서버의 임시 디렉토리에 들어가게 됨 // error : 에러 // size : byte단위 크기 파일을 업로드하는 부문이다. test.php // 에러 출력 -> 트러블슈팅 편하게 하는 옵션 ini_set("display_errors", "1"); // 임시 디렉토리에서 파일 디렉토리로 옮기는 변수 // Window 운영체제의 경우, 끝에 \\를 붙여야한다. $uploaddir = 'C:\Bitnami\wampstack-8.0.5-0\apache2\htdocs\upload\files\\'; // 보안을 위해 ba..
pwd, cd // 현재 디렉토리 확인 echo getcwd().' '; // 위치 이동 chdir('../'); echo getcwd().' '; ls //현재 디렉토리 사용 $dir = './'; //현재 디렉토리에 대한 파일들 출력 $file1 = scandir($dir); // 일반 $file2 = scandir($dir, 1); // 1 옵션 : 정렬순서 바꾸기 //출력 print_r($file1); print_r($file2); mkdir //폴더만들기 mkdir("1/2/3/4",// 디렉토리명 0700, //권한 true //첫 번째 인자의 경로가 만약 없다면 만들어줄까? );
[php file function] 원본 파일이 존재해야 한다. 복사하기 $file = 'readme.txt'; $newfile = 'test.txt.bak'; // 참일경우 성공, 거짓일경우 실패 // 원본파일 복사할파일 if(!copy($file, $newfile)){ echo "failed to copy $file...\n"; } 삭제하기 // 삭제 unlink('test.txt.bak'); 읽고 쓰기 (fopen도 있음 - https://www.php.net/manual/en/function.fopen) $file = './readme.txt'; //읽기 echo file_get_contents($file); //url로 읽을 수도 있음. //쓰기 file_put_contents($file, 'h..
