반응형 개발34 Vue.js 강좌 1. Vue를 제대로 이해하면서 시작하자 Vue를 그동안 사용해오면서 그때그때 필요한걸 하나씩 찾아보면서 사용해왔는데, 기본부터 확실하게 하나씩 공부해보자란 생각이 들었다. 그리고 Vue를 사용하려는 사람들을 위해 Vue를 내 것으로 만들 수 있도록 최대한 쉽게 설명하기 위해 기록을 남기려고 한다. 가장 먼저 Vue의 가장 기본적인 컨셉이 무엇인지는 아래 포스팅에서 간단하게 설명을 하였으니 먼저 보길 추천한다. Vue 시작하기전 알아야할 핵심 특징 목차 Vue Application 만들기 컴포넌트 단위로 파일 분리 컴포넌트 추가 지금부터 Vue 어플리케이션이 어떻게 시작이 되는지부터 파일을 컴포넌트 단위로 분리하는 것까지 3단계로 설명 할 것이다. ■ Vue Application 만들기Vue가 처음에 어떻게 동작하는지를 쉽게 설명하기 위해 bu.. 2023. 3. 24. 웹사이트에 애니메이션 간단하게 주기 - animate.css 이번 포스팅에서는 웹사이트에 애니메이션 효과를 정말 편하게 줄 수 있는 라이브러리를 소개한다. 자바스크립트 코드는 전혀 필요없이 필요한 곳에 class 추가만 해주면 애니메이션이 적용되는 CSS 라이브러리이다. 다양한 애니메이션 효과가 있어서 원하는 것을 골라서 class만 추가해주면 바로 적용이 된다. Animate.css 라이브러리 이름은 animate.css이다. 설치 및 사용법은 아주 간단하므로 문서를 참고하면 된다. 설치 npm 설치 $ npm install animate.css --save 파일 import import 'animate.css' 사용법 적용할 html 요소에 아래와 같이 클래스를 추가하면 끝이다. element 추가로 몇가지 옵션이 있는데 이름만 보면 무엇인지 쉽게 알 수 있을.. 2023. 3. 22. Javascript ECMAScript 2016, 2017 추가된 기능 Javscript의 표준안은 ECMAScript 2015 (ES6) 이후로도 계속 이어져 왔다. 이번 포스팅에서는 ECMAScript 2016, 2017 어떠한 기능이 추가되었는지를 알기쉽게 정리하여 보았으니, 몰라서 못쓰는 기능이 없도록 한번씩 훑어보고 머릿속에 담아두었다가 필요할때 꺼내쓰자. 참고로 ECMAScript2015 까지는 ES6 라고 불렀는데, ECMAScript 2016부터는 줄여서 ES7, ES8 이 아닌 ES2016, ES2017 와 같이 연도를 붙여서 표기한다. 가끔 연도와 버전이 혼동되었는데, 차라리 연도로 통일하는게 더 보기 좋은거 같다. ECMAScript 2016 (ES2016) 지수연산자 (**) // 거득제곱 let x = 2 ** 4; // 2 * 2 * 2 * 2 = .. 2023. 3. 22. AWS ALB(Application Load Balancer) - IP로 웹사이트 접근 막기 웹사이트를 오픈하고 구글 SEO도 적용하고 시간이 조금 지나서 구글에 검색이 되나 확인해보니까 검색결과에 도메인이 아닌 ip주소로 나오는 걸 보았다. 생각해보니 IP로 접근하면 SSL 인증서 에러가 나지만 웹서버로 접근이 가능하다는 걸 깨닫고 AWS에서 들어가서 수정하였다. 일단 구글 검색결과에 왜 ip 주소로 노출이 되었는지는 모르겠다. 분명히 구글써치콘솔에도 도메인으로 등록을 해놨고 구글 크롤링봇이 IP로 크롤링을 하지는 않을거 같은데 이유는 구글만 알 것 같다. 하지만 중요한건 검색결과가 어쨌든간에 IP로의 접근을 차단하고 싶다는 것이다. ALB (Application Load Balancer) AWS의 ALB를 통해 로드밸런싱을 하고 있다. ALB 설정을 이용하여 웹사이트 IP로 들어오는 요청을 .. 2023. 3. 20. 이전 1 ··· 3 4 5 6 7 8 9 다음 반응형