본문 바로가기
반응형

Programming/JavaScript14

[Vue.js] 초보자를위한 vue.js 설치 방법 1. 컴퓨터에 Node.js를 설치합니다. Vue.js는 Node.js 위에 구축되므로 Vue.js를 사용하려면 Node.js를 설치해야 합니다. 2. Node.js 공식 웹사이트(https://nodejs.org)에서 Node.js를 다운로드하여 설치할 수 있습니다. Node.js가 설치되면 명령 프롬프트 또는 터미널 창을 엽니다. Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 3. 다음 명령을 입력하여 Vue CLI를 설치합니다. npm install -g @vue/cli 이렇게 하면 컴퓨터에 Vue CLI가 전체적으로 설치됩니다. 4.다음 명령을 입력하여 Vue CLI가 올바르게 설.. 2023. 3. 15.
[Lottie] SVG를 Web에 구현해보자 Lottie란 무엇인가요? 로티는 에어비앤비에서 개발한 라이브러리로, 개발자가 프로젝트에서 벡터 애니메이션을 로티 JSON 파일로 쉽게 구현할 수 있도록 지원합니다. 이러한 애니메이션은 어도비 애프터 이펙트 또는 JSON 파일을 내보낼 수 있는 다른 소프트웨어를 사용하여 만들 수 있습니다. 개발자는 로티를 사용하여 복잡한 코드를 작성하지 않고도 웹, 모바일 및 데스크톱 애플리케이션에 고품질 애니메이션을 추가할 수 있습니다. 로티 애니메이션은 쉽게 크기를 늘리거나 줄일 수 있으며 파일 크기도 작아 웹에서 사용하기에 이상적입니다. Lottie Docs airbnb.io Lottie 설치하기 웹 프로젝트에서 로티를 사용하려면 먼저 로티 자바스크립트 라이브러리를 다운로드해야 합니다. Lottie GitHub 리.. 2023. 3. 8.
[JavaScript] 간단한 레이어 팝업 구현 HTML 모달 팝업 열기 × 모달 팝업 내용 CSS .modal { display: none; position: fixed; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.4); } .modal-content { background-color: #fff; margin: 15% auto; padding: 20px; border: 1px solid #888; width: 80%; } .close { color: #aaa; float: right; font-size: 28px; font-weight: bold; } .close:hover, .close:focus { colo.. 2023. 3. 3.
Vue.js와 React.js의 차이점과 장단점 Vue.js와 React.js의 차이점과 장단점 Vue.js와 React.js는 모두 인기 있는 프론트엔드 자바스크립트 프레임워크입니다. 이 둘의 차이점과 장단점을 살펴보겠습니다. Vue.js https://vuejs.org/ Vue.js - The Progressive JavaScript Framework | Vue.js Versatile A rich, incrementally adoptable ecosystem that scales between a library and a full-featured framework. vuejs.org 장점 간결하고 직관적인 문법: Vue.js는 템플릿, 로직, 스타일 등을 컴포넌트 단위로 작성할 수 있으며, 이를 HTML, CSS, JavaScript 파일로 분리할.. 2023. 3. 2.
[React] 리액트 설치 및 실행 방법 React.js는 Facebook에서 개발한 사용자 인터페이스 라이브러리로, 다양한 웹 애플리케이션을 개발하는 데 사용됩니다. 이번 포스트에서는 초보자를 위한 React.js 설치 방법에 대해 알아보겠습니다. https://ko.reactjs.org/ React – 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리 A JavaScript library for building user interfaces ko.reactjs.org Node.js 설치하기 React.js를 사용하기 위해서는 Node.js가 설치되어 있어야 합니다. Node.js는 자바스크립트 런타임으로, 서버 측 자바스크립트를 실행할 수 있도록 해줍니다. Node.js를 설치하기 위해서는 공식 사이트에서 다운로드 받아 설치합니다.. 2023. 3. 2.
[amCharts.js] 커서 툴팁 구현 1. amCharts 라이브러리 및 jQuery 라이브러리를 로드합니다. 2. amCharts 차트를 생성합니다. // 차트 생성 var chart = am4core.create("chartdiv", am4charts.XYChart); // 차트 데이터 설정 chart.data = [{ "date": "2021-01-01", "value": 10 }, { "date": "2021-01-02", "value": 20 }, { "date": "2021-01-03", "value": 15 }, { "date": "2021-01-04", "value": 25 }, { "date": "2021-01-05", "value": 18 }]; // 차트 축 설정 var dateAxis = chart.xAxes.push(.. 2023. 3. 2.
728x90
반응형