본문 바로가기
반응형

개발이야기37

[Vue] Vue3 ref, reactive 사용해보기 이번에 vue3에서 composition api가 추가됨으로써 vue2 사용자 시점에서 ref와 reactive에 대하여 간단한 예제 소스를 작성해 보았다. 1. data()와 ref() 기존 vue2에서 데이터를 핸들링 할때는 사실 반응형이라는것에 신경쓰지 않고 사용했던거 같다. {{text}} 2초 뒤에 text를 변경하는 예제이다. 반응형이라는것이 그냥 당연하다고만 여겨졌었다.. {{text1}} {{text2}} 동일한 vue3의 예제이다. 실행해보면 2초뒤에 text1은 변경이 되지 않고, ref를 사용한 text2는 변경이된것을 확인 할 수 있다. setTimeout안에서 vue2와는 다르게 this를 사용하지 않으며, ref에 접근하기 위해서는 .value로 접근해야 된다. 최종적으로 tex.. 2020. 9. 20.
젠킨스 간단 사용기 #1. 설치 Contents 젠킨스 간단 사용기 #1. 설치 젠킨스 간단 사용기 #2. GitHub 연동 젠킨스 간단 사용기 #2. 자동배포 테스트 환경 - Red Hat Enterprise Linux version 8 - JDK 1.8 - Jenkins 2 - Node 10 - Nginx - Git - GitHub 목적 - 젠킨스 설치 #1. 설치 젠킨스는 java 기반으로 돌아가기 때문에 jdk를 설치해 줍니다. sudo yum install java-1.8.0-openjdk-devel.x86_64 -y git 설치 sudo yum install git jenkins.ropo 파일 설정 sudo wget -O /etc/yum.repos.d/jenkins.repo sudo rpm --import 또는 직접 설정 하.. 2020. 9. 14.
Requested domain is not a FQDN because it contains an empty label. letsencrypt 를 사용해서 기존에쓰던 도메인 +@ 로 추가해주려 했다. 기존 정보를 불러오기 위한 ./letsencrypt-auto certificates 명령어 사용 ./letsencrypt-auto certificates - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Found the following certs: Certificate Name: [NAME] Serial Number: *************** Domains: [도메인1] Expiry Date: 2020-10-25 01:08:16+00:00 (VALID: 89 days) Certificate Path: /etc/letsencryp.. 2020. 7. 27.
[NGINX] (13: Permission denied) nginx에서 80/81/82번 포트를 오픈 하려고 했더니 아래와같은 오류가 나왔다. /var/log/nginx/error.log [emerg] 1231212#0: bind() to 0.0.0.0:82 failed (13: Permission denied) semanage 명령어를 사용해서 포트를 추가해주려 했으나 semanage port -a -t http_port_t -p tcp 82 -bash: semanage: command not found semanage 가 설치되어있지 않았다. policycoreutils-python 를 설치하여 semanage명령어를 사용 할 수 있었다. yum -y install policycoreutils-python 출처 https://www.burndogfather.. 2020. 7. 14.
[Vuetify] 메뉴 만들기 (With Vuex) 환경 - Node v10.16.0 - Vuetify2 Vuetify와 Vuex를 사용하여 2뎁스까지 지원하는 메뉴 체계를 작성해 보았습니다. 화면구성 Menus.vue : 메뉴 출력 및 동작 컴포넌트 PageTitle.vue : 페이지 타이틀 아이콘/이름 출력 컴포넌트 Index.vue : 라우터로 이동될 페이지 메뉴 이동에따라 화면을 전환하고 PageTItle내용을 수정해 주겠습니다. Index.vue (메뉴설정) 부분에는 메뉴 색상 및 메뉴 추가, 삭제 기능이 있습니다. store/state/color.js const colorState = { colors: { menu_background_color: '#263238', menu_selected_color: 'red', } } export defau.. 2020. 7. 13.
[Vuetify] DatePicker + TimePicker 환경 - Node v10.16.0 - Vuetify2 날짜와 시간을 함께 선택 하여 사용하고 싶어서 Vuetify에 Date Picker와 TimePicker 예제를 합쳐 보았습니다. (2020-07-13 12:37) 와 같은 형식의 산출물 Page.vue DateTimePicker 컴포넌트를 불러옵니다. DateTimePicker.vue Cancel OK Cancel OK set() 함수에서 2020-07-16 04:22 형식으로 date 변수에 담깁니다. 참고 자료 https://vuetifyjs.com/ko/components/date-pickers/ Date picker component — Vuetify.js The date picker component is a stand-alone inter.. 2020. 7. 13.
[NPM] Error: EACES : permission deined, mkdir ' ... node sass/build' npm install 중 Error: EACES : permission deined, mkdir ' ... node-sass/build' 에러가 발생했을때 sudo rm -rf ~/.node-gyp sudo npm cache clean -f sudo npm install -g n sudo n stable sudo npm i --unsafe-perm 2020. 7. 6.
[MariaDB]Error Code: 1221. Incorrect usage of DB GRANT and GLOBAL PRIVILEGES RDS MariaDB 인스턴스, 계정을 생성하고 mysql> CREATE USER '사용자명'@'%' IDENTIFIED BY '패스워드'; mysql> CREATE USER 'joadmin'@'%' IDENTIFIED BY 'password'; 생성한 계정을 'A' 테이블에만 접근할 수 있도록 권한을 주려 한다. mysql> GRANT ALL PRIVILEGES ON 테이블명.* TO '사용자명'@'%' IDENTIFIED BY '패스워드' WITH GRANT OPTION; mysql> GRANT ALL PRIVILEGES ON A.* TO 'joadmin'@'%' IDENTIFIED BY 'password' WITH GRANT OPTION; Error Code: 1221. Incorrect usage.. 2020. 7. 5.
#5. SSL 인증서 설정 Contents #1. CentOS7 서버 생성 및 설정(With 네이버 클라우드 플랫폼) #2. Root 계정 설정 #3. MariaDB 설치 및 설정 #4. Nginx 설치 및 설정 #5. SSL 인증서 설정 5-1 Let`s Encrypt 설치 및 설정 5-2 Nginx 설정 5-3 인증서 갱신 (대망의)5. SSL 인증서 설정 5-1 Let`s Encrypt 설치 및 설정 yum install –y git git clone https://github.com/letsencrypt/letsencrypt yum 명령어로 git 을 설치해 준 뒤, Let`s Encrypt 를 clone 받는다 letsencrypt 폴더가 생성되면 성공 ./letsencrypt-auto certonly —standalon.. 2020. 3. 19.
도메인 신청하기 (With가비아) 가비아를 통해서 도메인을 신청하는 방법을 간단히 적어 보겠다. 가비아를 선택한 이유는 타사 대비 페이지가 이쁘다(전지적FE개발자시점) + 페이지가 Vue.js 로 되어있다 :D 메인 페이지에서 도메인을 클릭 후 내가 사용할 도메인(joweb) 을 검색한다. 무난한 가격의 .site를 선택해주었다. 기간을 1년으로 설정하면 이벤트 가격으로만 구입 할 수 있다. 나머지는 개인정보 입력, 동의 절차를 진행 후 서비스 비용 결제 를 하면 완료! 마이페이지 에서 관리툴 로 이동한다. DNS 레코드 설정 버튼을 누른다. 설정 버튼을 누르면 아래와 같이 나온다. 호스트 www와 나의 공인 IP를 입력 후 확인 호스트 @ 와 나의 공인 IP를 입력 후 확인 후 저장버튼을 누르면 세팅이 완료 된다! 5~10분 정도 ? .. 2020. 2. 26.
반응형

티스토리툴바