분류 전체보기474 로딩 화면 만들기 bootstrap에 spinner 클래스를 이용 https://getbootstrap.com/docs/5.1/components/spinners/ Spinners Indicate the loading state of a component or page with Bootstrap spinners, built entirely with HTML, CSS, and no JavaScript. getbootstrap.com movie.js import axios from 'axios' // 중복제거을 위해서 uniqBy를 사용 import _uniqBy from 'lodash/uniqBy' export default { // module! namespaced: true, //data! state: () => ({ .. 2021. 9. 27. container 너비 사용자 지정 bootstrap의 container속성을 사용자가 지정하여 설정할 수 있다. 공식 문서 https://getbootstrap.com/docs/5.1/layout/containers/ Containers Containers are a fundamental building block of Bootstrap that contain, pad, and align your content within a given device or viewport. getbootstrap.com main.scss // 사용자 너비 지정 $container-max-widths: ( sm: 540px, md: 704px, lg: 964px, xl: 1140px, xxl: 1364px ); 2021. 9. 23. 특정 영역의 문자를 ... 으로 표현하는 방법 The brown fox jumps over the lazy dog div { background-color: orange; font-size: 30px; padding: 20px; width: 200px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 확인 필터 처리 방법 div { background-color: orange; font-size: 30px; padding: 20px; width: 200px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position: relative; } div::after { content: ""; position: abso.. 2021. 9. 16. 비동기 - API 비동기 처리 연습 비동기 처리 연습을 위해 아래 사이트에서 스크립트 url을 가져온다. https://cdnjs.com/libraries/axios axios - Libraries - cdnjs - The #1 free and open source CDN built to make life easier for developers Promise based HTTP client for the browser and node.js - Simple. Fast. Reliable. Content delivery at its finest. cdnjs is a free and open-source CDN service trusted by over 12.5% of all websites, serving over 200 billion requ.. 2021. 9. 13. 영속성 구성을 위한 mysql 설정 MySql 설치 MySQL Server 설치 (For Windows, Community) : 네이버 블로그 (naver.com) MySQL Server 설치 (For Windows, Community) 이 설명서는 Windows 운영체제에서 동작하는 MySQL Server Community 8.0.11 버전을 설치하는 방법... blog.naver.com MySql 실행 시작메뉴에서 commend line client를 실행한 다음에 비밀번호를 입력하면 실행된다. 인테리제이에서 DB 설정 + 버튼을 클릭하여 MySql을 추가해준다. 처음 사용하는 것이라면 드라이버 설치 팝업이 나올텐데 클릭하여 설치를 진행한다. 그 후 아래와 같이 기본 설정을 입력하고 연결 테스트를 진행한다. 고급 탭에서 아래와 같이 추.. 2021. 9. 12. 비동기 예외 처리(then, catch, finally) Promise 공식 문서 https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Promise#%EB%A9%94%EC%84%9C%EB%93%9C Promise - JavaScript | MDN Promise 객체는 비동기 작업이 맞이할 미래의 완료 또는 실패와 그 결과 값을 나타냅니다. developer.mozilla.org resolve 메서드를 이용한 비동기 처리 방법 function a() { return new Promise ((resolve) => { setTimeout(() => { console.log('A') resolve() }, 1000) }) } function b() { return new Promi.. 2021. 9. 10. 이전 1 ··· 14 15 16 17 18 19 20 ··· 79 다음