개발
-
Vue Router개발/Front-end 2021. 8. 24. 19:12
이번 시간에는 Vue Router에 대해 학습합니다. 사용자가 접속한 주소에 따라 페이지가 달라지는 것을 라우팅이라고 합니다. 이번 시간에는 라우팅이 무엇인지 파악하고, Vue에서 라우팅 처리를 위해 사용하는 플러그인 vue-router에 대한 설치 및 사용법에 대해 알아봅니다. 또한 Vue CLI의 prefetch 기능에 대해 이해하고 컴포넌트 로딩 시점을 설계하는 방법도 익혀봅니다. 1. 라우팅이란? 라우팅이란 사용자가 접속한 주소에 따라 페이지(컴포넌트)가 전환되는 것을 의미합니다. 뷰 라우터는 뷰 라이브러리를 이용하여 싱글 페이지 애플리케이션을 구현할 때 사용하는 라이브러리입니다. vue 프로젝트 내부에서는 미리 url를 정의하고, 각 주소마다 vue 페이지를 연결해 놓습니다. Vue는 vue에서..
-
2. Vue CLI로 Vue 프로젝트 생성하기개발/Front-end 2021. 8. 11. 19:37
Vue CLI는 Vue 프로젝트를 빠르게 구성하고, 빌드, 디플로이 할 수 있게 도와주는 도구입니다. 우선 CLI 설치를 해보고 프로젝트를 설치하는 3가지 방법에 대해서 알아봅시다. 처음에는 Default 옵션 설치 두 번째로는 Manully 옵션 설치 마지막으로 Vue 프로젝트 매니저를 이용하여 UI 상으로 설치하는 방법에 대해서 알아봅시다. 1. Vue CLI 설치 아래는 vue cli를 설치하는 명령어입니다. npm install -g @vue/cli -g: 해당 패키지가 현재 디렉토리뿐만 아니라 앞으로 생성되는 모든 프로젝트에서 사용할 수 있는 global 패키지 등록 2. Default 옵션으로 프로젝트 설치하기 해당 옵션으로 프로젝트를 생성하는 경우 기본적으로 설정된 값으로 설치가 됩니다. 2..
-
Vue.js 는 무엇인가?개발/Front-end 2021. 8. 9. 22:40
Vue.js 가 무엇인지 알아보고, React, Angular와 같은 다른 프론엔드 프로임워크와 비교하여 어떤 특징이 있는지 알아봅니다. 1. Vue.js는 무엇인가? Vue.js는 SPA(Single Page Application) 개발을 위한 프로트엔드 프레임워크입니다. SPA(Single Page Application)는 단일 페이지 애플리케이션을 말합니다. 이는 웹사이트 접속 시 열리는 방식이 일반적인 웹사이트와 다른 경우입니다. 일반적인 웹사이트는 페이지 이동할 때마다 매번 재 로딩하게 됩니다. 반면 SPA는 처음에 웹사이트를 접속할 때 모든 자원을 서버로부터 가져와서 로딩을 합니다. 또한 페이지를 이동할 때 전체 페이지가 재로딩되는 것이 아닌 변경된 부분만 바뀌게 됩니다. 2. Vue.js 장..
-
docker log fluentd 설정개발/log(로그)관리 2021. 6. 10. 12:53
1. fluentd란? 각종 로그를 수집하고 저장할 수 있는 기능을 제공하는 오픈소스 도구로 도커 엔진 컨테이너 로그를 fluentd를 통해 저장할 수 있도록 플로그인을 제공합니다. fluentd는 수집된 데이터를 aws s3, HDFS, MongoDB 등 다양한 저장소에 저장할 수 있다는 장점이 있습니다. 도커 로그를 fluentd를 통해 저장하려고 합니다. 여러 output 중에서 파일 output, mongodb output 설정을 실습으로 하겠습니다. 2. fluentd 로깅 설정하기 2-1. docker 설정 1. fluentd docker 이미지 생성 Dockerfile 생성 # vi Dockerfile FROM fluent/fluentd:v1.12-debian-1 # Use root acco..
-
[글또 4기 회고] 글또 4기를 마치며개발/Etc 2020. 8. 15. 21:31
6개월이라는 기간 동안 글또를 진행하였는데요. 총 12개(패스 2개 포함)를 작성했네요. 10만원이라는 보증금💸을 지키기 + 책임감으로 열심히 했던 것 같은데요. 당시에는 열심히 하려고 노력을 했다고 생각했는데 지금 보니 아쉬운 마음이 크네요. 사실 글또를 하면서 2주에 한번 올리는 것이 쉬울 것 같았는데요. 생각보다 스트레스도 많았어요.(사실 대충 할 수 있지만, 그게 허용이 안 되는 성격이라서 더 힘들었던 것 같네요😢) 그래서 중간에 글또를 그만둘까?라는 생각도 했지만... 처음 글또 목표를 생각하고 지금까지 버티어 마지막 회고까지 쓰게 되네요. 이렇게 버틴 덕분에 얻은 것이 더 많았어요! 현재 자신의 블로그에 피드백이 필요하거나 개발자로 더 부지런해지고 싶다면 글또에 신청하는 것을 추천합니다 👍 글..
-
Head First design patterns 책 리뷰개발/Design Patterns 2020. 8. 14. 17:27
디자인 패턴 책으로 유명한 Head First design patterns 책을 읽고 리뷰를 남기려고 합니다. 해당 책에 대해 간단히 소개하고 제가 읽고 느낀 부분을 말씀드리겠습니다. Head First design patterns 소개 Head First design patterns 책은 이름에서 알 수 있듯이 디자인 패턴에 대해 다룬 책입니다. 부록까지 포함하면 아래 리스트와 같이 총 14장으로 구성되어 있습니다. 아래의 목차를 보면 알 수 있듯이 1장 디자인 패턴 소개에서는 왜 디자인 패턴을 배워야 하는지에 대한 설명을 합니다. 그 외 장들은 각 패턴에 대해 소개와 예제를 실습해 보는 구성입니다. 디자인 패턴의 세계에 오신 것을 환영합니다: 디자인 패턴 소개 객체들에게 연락망을 돌립시다: 옵저버 패..
-
[2019.11.18/ 우아한 Tech] 우아한 레디스(Redis) 세미나 후기 -강대명님개발/Seminar 2020. 8. 7. 18:02
0. 들어가기 전에 - 후기 회사에서 redis를 사용하고 있어서 개선할 점이나 다른 회사는 어떤 식으로 사용하는지 보기 위해서 세미나에 참석하게 되었다. 강대명 님의 세미나를 듣고, redis 관리 방법이나 사용하면 주의 점 등 기존에 몰랐던 점을 많이 알게 되어서 정말 유익하였습니다.👏👏 강연 자료: https://www.slideshare.net/charsyam2/redis-196314086 강연: youtu.be/mPB2CZiAkKM 1. 목차 Redis 소개 왜 Collection이 중요한가? Redis Collections Redis 운영 Redis 데이터 분산 Redis failover 1. Redis 소개 1-1. 소개 전에 Cache # 캐시 구조 1. Look aside Cache 현재..
-
[2019.11.16/ Women Who Code Seoul] Year-end Party a little early 세미나 후기개발/Seminar 2020. 8. 7. 17:24
https://www.facebook.com/groups/wwcodeseoul/ 페이스북에 가입을 하다가 연말 파티를 한다고 하여 참석하게 되었습니다. 일정은 아래와 같았고, 저는 오른쪽에 있는 B세션을 들었습니다. 😃 제가 들으면서 괜찮았던 부분만 간단히 요약해봤습니다~ 1. 정사윤 님 - 이 길이 아닌 것 같다면? 나의 길을 만들자. 유튜브에서 구독도하고 자주 보신 분이라 너무 반가웠습니다. 정사윤 님은 대기업을 다니는 개발자였는데, 자신의 길과 맞지 않는 것 같아서 그만두게 되고, 현재는 자신과 맞는 능력 + IT 기반 기술을 합하여 프리랜서로 일하고 계신다 하였습니다. 정사윤 님이 강조하신 부분은 자신에게 맞는 능력?(마케팅, 서비스 기획, 운동 등) + IT 능력을 합하여 나의 길을 만들자! 는..