본문 바로가기
728x90
반응형

전체보기418

[react] Router Single Page Application(SPA) 서버로부터 새로운 페이지를 불러오지 않고 현재의 페이지에 컴포넌트를 통해 동적으로 다시 작성하여 클라이언트와 소통하는 웹 애플리케이션이다. 필요한 모든 소스는 하나의 페이지에서 새로고침 없이 동작하게 된다. 그러나, SPA를 기반으로 개발할 때 흔히 겪는 어려움 중 하나는 웹페이지의 라우팅이다. 기본적으로 SPA에서 라우팅을 구현하게 되면 url path가 아닌 현재 어떤 컴포넌트가 렌더링 되어야 하는지 state를 통하여 관리를 한다. 이렇게 되면 다음과 같은 문제가 발생하게 된다. 1. 컴포넌트가 전환되어도 브라우저 주소창의 URL은 고정되어 있기 때문에 특정 페이지에 대한 즐겨찾기 등록이 불가능하다. 2. 뒤로가기 버튼을 누르면 해당 앱 내에서 이.. 2022. 3. 2.
[react] props props props 는 컴포넌트에서 사용 할 데이터 중 변동되지 않는 데이터를 다룰 때 사용한다. parent 컴포넌트에서 child 컴포넌트로 데이터를 전할 때, props 가 사용된다. props 추가하기 컴포넌트에서 변하지 않는 데이터가 필요 할 땐, render() 메소드의 내부에 안에 { this.props.propsName } 형식으로 넣고, 컴포넌트를 사용 할 때, 괄호 안에 propsName="value" 를 넣어 값을 설정한다. src/components/Header.js import React from 'react'; class Header extends React.Component { render(){ return ( { this.props.title } ); } } expo.. 2022. 3. 2.
[react] 리액트 초기 프로젝트 생성 리액트 프로젝트 생성 및 실행 방법 프로젝트 생성 프로젝트 생성 명령 설치하기 npm install -g create-react-app 위 명령으로 리액트 프로젝트를 생성하는 create-react-app명령을 설치했다. -g옵션이 주어졌기 때문에 시스템 공통 폴더에 설치된다. 따라서 프로젝트를 새로 생성할 때마다 위 명령을 반복할 필요가 없다. npx 로 프로젝트를 생성해야 하는데 npx 를 설치하기 위해서는 npm 을 통해서 설치 가능하다. npm install npx -g 프로젝트 생성하기 npx create-react-app [프로젝트이름] create-react-app명령을 실행하여 프로젝트를 생성할 수 있다. 프로젝트 이름으로 영어 대문자는 사용이 불가능하다. 프로젝트 실행 생성한 프로젝트 폴.. 2022. 3. 2.
자바 랜덤 API 암호화 BASE64 KEY 생성 package egovframework.util; import org.apache.commons.codec.binary.Base64; import javax.crypto.KeyGenerator; import javax.crypto.SecretKey; import javax.xml.bind.DatatypeConverter; import java.security.NoSuchAlgorithmException; import java.security.SecureRandom; public class RandomAESKeyGen { public static String generate(final int keyLen) throws NoSuchAlgorithmException { KeyGenerator keyGen = .. 2022. 1. 13.
아파치 2.4.52 소스 컴파일 설치 컴파일 설치 컴파일 할 소스 다운로드 https://httpd.apache.org/download.cgi Download - The Apache HTTP Server Project Downloading the Apache HTTP Server Use the links below to download the Apache HTTP Server from one of our mirrors. You must verify the integrity of the downloaded files using signatures downloaded from our main distribution directory. The signatures can be httpd.apache.org 접속하여 최신버전 .tar.gz 파일을 다.. 2021. 12. 29.
리눅스 sudo 권한 부여하기 root 권한을 접속후 [root@localhost /]# ll /etc/sudoers -r--r-----. 1 root root 4355 12월 23 00:52 /etc/sudoers 속성이 읽기 전용이다. 보안상 필요할때만 쓰기로 바꿔서 사용하고 읽기전용으로 변경한다. [root@localhost /]# chmod +w /etc/sudoers [root@localhost /]# ll /etc/sudoers -rw-r-----. 1 root root 4355 12월 23 00:52 /etc/sudoers sudoers 파일을 편집한다. [root@localhost /]# vi /etc/sudoers ## Next comes the main part: which users can run what soft.. 2021. 12. 23.
CentOS,RHEL 리눅스 ISO파일로 로컬 저장소 만들기 인터넷이 차단된 서버에서 ISO Image파일을 이용해서 로컬 저장소 만들기 1. mount할 폴더를 생성 [root@localhost /]# mkdir -p /localrepos 2. 다운받은 CentOS 또는 RHEL 리눅스 풀버전 iso 파일을 서버에 올린후 mount 합니다. -rw-r--r--. 1 root root 10975444992 12월 22 21:17 rhel-8.5-x86_64-dvd.iso [root@localhost iso]# pwd /home/roo/iso 임의의 폴더를 생성후 생성된 폴더에 다운받은 rhel-8.5-x86_64-dvd.iso 파일을 올립니다. 마운트 합니다. [root@localhost iso]# mount -o loop /home/roo/iso/rhel-8.5.. 2021. 12. 23.
인터넷 없는 환경에서 패키지 설치 리눅스 시스템에 로컬 repo 저장소를 만들어서 yum을 통하여 설치한다. 로컬에 레파지토리를 구축하기 위해서는 레파지토리 관리를 해주는 createrepo를 설치하여 로컬레파지토리를 구축한다. 일단 인터넷이 되는 리눅스에서 root계정으로 로그인 후에 createrepo 패키지를 먼저 다운 받는다. 다운 받을 폴더를 하나 만든다. mkdir /createrepo 폴더를 만든후 yum을 이용하여 의존성까지 설치는 하지 말고 옵션을 이용하여 다운받는다. yum install -y --downloadonly --downloaddir=/createrepo createrepo ■ createrepo 설치하기 설치하고자 하는 패키지르들 모두 다운받은후 해당 파일을 카피하여 인터넷이 안되는 리눅스에 파일을 복사하고.. 2021. 12. 15.
[PostgreSql] 리눅스 postgresql 소스 컴파일 설치 https://www.postgresql.org/ftp/source/v13.4/ PostgreSQL: File Browser www.postgresql.org postgresql 버전 13.4 centos 에 소스 컴파일 설치 리눅스에서 postgresql 설치할 사용자 계정을 root에서 생성한다. adduser passdata 사용자 암호생성 passwd passdata 새암호: 새암호 재입력: postgresql 사이트에서 다운받은 postgresql-13.4.tar.gz 파일을 생성된 사용자 계정 홈디렉토리에 전송한다. 압축을 푼다 : tar -zxvf postgresql-13.4.tar.gz cd postgresql-13.4 ■ 설치할 디렉토리 생성 mkdir -p /apps/postgresql.. 2021. 12. 14.
자바로 크로스 도메인 우회처리 /** * 크로스 도메인 우회처리 * @param map * @return */ public static String processHTTP(Map params ) throws Exception { int statusCode = 0; String url= params.get("url"); logger.debug("url : " + url); CloseableHttpClient httpclient = HttpClientBuilder.create().build(); HttpPost httpPost = new HttpPost(url); List nvps = makeParams(params); try { httpPost.setHeader("Content-Type", "application/x-www-form-ur.. 2021. 12. 14.
국세청 사업자번호 진위확인 var ItemJSON; ItemJSON = '{"b_no": ["'+bNo+'"]}'; console.log("ItemJSON",ItemJSON) URL = "http://api.odcloud.kr/api/nts-businessman/v1/status?serviceKey=발급받은서비스키"; //Your URL var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = callbackFunction(xmlhttp); xmlhttp.open("POST", URL, false); xmlhttp.setRequestHeader("Content-Type", "application/json"); // xmlhttp.setRequestHeader('Author.. 2021. 12. 14.
vscode Sass Compiler 설치 1. 설치하기 확장플러그인에서 검색하여 설치 - SASS 컴파일을 자동으로 해주는 플러그인 - [SASS Lint]도 같이 설치하면 SASS문법을 쉽게 코딩할 수 있다. Sass Lint를 통해 Sass문법을 쉽게 작성가능 2. [Watch SASS] - [Live Sass Compiler]를 설치하면 하단 상태표시줄에 [Watch Sass]버튼이 생성 빨간색으로 체크한 부분이 [Watch Sass]버튼 - [test.scss]에서 구문을 작성 후 [Watch Sass]를 누르면 [test.css]가 바로 생성 1) 자동생성해보기 # HTML코드 SASS테스트 제목태그 # SCSS코드 $mainColor: red; h1{ color: $mainColor; } # 자동 컴파일 과정 # 컴파일된 CSS코드 .. 2021. 11. 27.
[PostgreSql] 데이터 이관시 트리거 비활성후 테이블 데이터 삭제 /* 데이터 마이그레이션의 경우 모든 트리거 비활성 하는 방법 */ /* 비활성 시키고 데이터 삭제 */ SET session_replication_role = 'replica'; SELECT 'delete from ' || tablename || ';' as de FROM pg_catalog.pg_tables where schemaname = '스키마명'; SELECT 'select * from ' || tablename || ';' as se FROM pg_catalog.pg_tables where schemaname = '스키마명'; /* 데이터 삭제후 활성 */ 마이그레이션 후 모두 다시 활성화 SET session_replication_role = 'origin' ; 2021. 11. 9.
[PostgreSql] 패스워드 없이 백업 및 복원 백업을 하기 위해서는 먼저 홈디렉토리에 패스워드 파일을 생성해야 한다. vi .pgpass 아래의 내용 추가 192.168.1.42:5432:*:아이디:패스워드 권한변경 chmod 0600 .pgpass /* 패스워드 없이 스키마 별로 백업 */ pg_dump --file "/var/lib/pgsql/test.dump" --host "192.168.1.42" --port "5432" --username "아이디" --no-password --verbose --format=c --section=pre-data --section=data --section=post-data --column-inserts --encoding "UTF8" --schema "스키마명" "db명" /* 패스워드 없이 스키마 별로 복.. 2021. 11. 9.
[PostgreSql] postgresql 13 확장팩 설치 /* 확장팩 확인 */ select * from pg_catalog.pg_available_extensions; PostgreSQL에서는 extension이라는 기능을 제공합니다. extension을 통해서 제3자의(외부) 프로그램을 plug-in 형태로 PostgreSQL에 연동할 수 있습니다. extension을 사용해서 PostgreSQL에서 제공하지 않는 추가적인 기능을 사용할 수 있습니다. 설치하는 방법은 PostgreSQL을 yum을 통해 설치했느냐, 또는 source를 통해 설치했느냐에 따라 다릅니다. 만약 PostgreSQL을 source를 통해 설치를 했다면, source 디렉토리에 contrib 디렉토리가 있습니다. 그 디렉토리에 들어가서, 아래 명령어를 통해 설치 하시면 됩니다. 만약.. 2021. 11. 8.
vue + 자바 파일다운로드 const form = new FormData() form.append('filepath', 'board') form.append('filename', 'test.pptx') form.append('originFileName', '1634543241310-1897687360') this.$axios({ method: 'POST', url: 'com/systemmng/file/downloadAxiosFiles.do', responseType: 'blob', headers: this.headerWeblog, data: form, params: { param1: 1, parma2: '한글', parma3: 'eng!@' } }) .then(response => { const fileName = 'test.pp.. 2021. 10. 19.
vue Event Bus 우선 Vue Event Bus 사용에는 두가지 방법이 있습니다. - 직접 Event Bus를 만들고 import 해서 사용하는 방법 - Vue에 내장되어있는 Event Bus 를 이용하는 방법 import 해서 사용하는 방법 장점 : 부모-자식 사이가 아니여도 사용이 가능하다. 너무 편하다. 단점 : 너무 많이 쓰이면 후에 관리하기 힘들다(찾기 힘들다) 1. Event Bus // EventBus.js import Vue from 'vue'; const EventBus = new Vue(); export default EventBus; 2. $emit 이벤트 호출 $emit('이벤트 이름', option) option에 값을 넣어서 보낼 수 있다. HelloWorld Change Component 3. .. 2021. 10. 18.
material 아이콘 url https://fonts.google.com/icons 2021. 10. 14.
[PostgreSQL] 날짜 범위 검색 PostgreSQL Date & Time Function 해당 날짜의 데이터 select count(watt_max) from tbl_test_watt3_sm2ch_min where to_char(regdate, 'YYYY-MM-DD') = '2016-10-17' 소요시간 : 124초 (150만건) (하루: 20*60*60*24 = 1,728,000) 이렇게 하면 망함! 해당 날짜의 데이터 select count(watt) from tbl_test_watt_lsh where regdate >= date '2016-10-17' and regdate = current_date and regdate '2016-10-17 07:40:00' AND to_char(regdate , 'YYYY-MM-DD HH24;M.. 2021. 10. 1.
[PostgreSQL] lock 확인,삭제 Lock 테이블 확인 select t.relname,l.locktype,page,virtualtransaction,pid,mode,granted from pg_locks l, pg_stat_all_tables t where l.relation=t.relid order by relation asc; Lock 삭제 select pg_cancel_backend(pid); 2021. 9. 29.
728x90
반응형

"이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다."
loading

티스토리툴바