그래프를 직접 만들어서 사용하는 것은 대단하다고 생각합니다. 하지만 일을 더욱 효율적으로 하기 위해서 다른 사람들이 만들어 놓은 좋은 소프트웨어를 가지고 일을 진행하면 업무 속도도 빠르고 좋다고 생각합니다. ECharts 설치하기 1. 콘텐츠 전송 네트워크(Content Delivery Network, CDN)를 이용해서 설치하기 이런 식으로 script import 많이 해보셨을 겁니다. 2. NPM Install npm install echarts 제가 요새는 npm을 사용하지 않아서 이 방법은 사용하지 않았는데, node.js를 사용하시는 분들이라면 당연히 이 방법이 가장 간편하다고 생각합니다. 3. 직접 다운로드하여 사용하기 https://github.com/apache/echarts/blob/m..
오늘은 Object.entries 와 sort 함수에 대하여 알아보도록 하겠습니다. 제가 이 함수를 사용하게 된 이유는 객체에 있는 value 값을 시간의 순서대로 나타내고 싶어서 이러한 함수를 사용하게 되었는데, 오늘은 가볍게 동물의 수로 정렬하는 것을 알아보도록 하겠습니다. 1. Object.entries 객체의 key 값과 value 값을 list 안에 list 형태로 담습니다. const keywordCount = { '말': 3, '코끼리': 1, '기린': 5 }; let entries = Object.entries(keywordCount); console.log(entries); // [ [ '말', 3 ], [ '코끼리', 1 ], [ '기린', 5 ] ] 결과를 보시면 리스트 안에 val..
오늘은 돈이나 숫자 3자리마다 , (쉼표, 콤마)를 찍어보는 것을 알아보도록 하겠습니다. 설명에 앞서 서버에서 돈이나 숫자 데이터를 받아서 화면에 나타낼 때, 컴마를 찍으려고 한 적 많으실 겁니다. 방법이 두 가지 있는데 아마 첫 번째 방법이 가장 무난하고 간단하다고 생각합니다. 간단한 방법부터 알아보도록 하죠. 1. toLocaleString() 함수 이용하기 number.toLocaleString(locales, options) 콤마를 찍으려는 숫자와 locales 그리고 options를 넣어서 코드를 실행하면 되는 구조입니다. locales 에는 국가의 코드를 넣어야 하는데.... 엄청나게 많습니다. https://www.iana.org/assignments/language-subtag-regist..
모달 창 만들기 연습에 앞서 팝업창과 모달 창의 차이점을 알아보겠습니다. (모달 창을 직접 만들어보면 알게 되지만요.) 팝업 창 목적: 팝업 창은 주로 새로운 브라우징 창을 열어 다른 웹 페이지, 광고, 알림, 미디어 등을 표시하는 데 사용됩니다. 주로 웹 브라우저에서 볼 수 있으며, 사용자에게 새로운 창을 열어 웹 페이지 내용을 표시합니다. 독립 창: 팝업 창은 일반적으로 원래 페이지와 독립된 창으로 열립니다. 이것은 다른 페이지와 분리되어 동작하므로 사용자가 주 창과 팝업 창 간을 이동하거나 중복 창을 열 수 있습니다. 제한적 동작: 팝업 창은 일반적으로 더 많은 권한을 갖습니다. JavaScript 팝업 창은 브라우저의 보안 기능을 우회할 수 있으므로 팝업 창이 남용되지 않도록 브라우저에서 차단되는..
23년 추석 연휴가 개천절까지 껴서 매우 길게 느껴졌습니다. 그러면서 궁금증이 생겼습니다. 과연 다음번에 있는 가장 긴 연휴는 언제일지 궁금해지기 시작했습니다. 그래서 저만의 국경일 달력? 표?를 만들어 보는 것도 재밌을 것 같더라고요. 국경일 API 승인받기 일단 제작에 앞서 국경일 API를 승인받아야 합니다. https://yogyui.tistory.com/entry/%EA%B3%B5%EA%B3%B5%EB%8D%B0%EC%9D%B4%ED%84%B0%ED%8F%AC%ED%84%B8%EA%B3%B5%ED%9C%B4%EC%9D%BC-%EB%8D%B0%EC%9D%B4%ED%84%B0-%EC%A1%B0%ED%9A%8C-REST-API 공공데이터포털::공휴일 데이터 조회 (REST API) 회사에서 사원별 공수..
1탄 : https://pabeba.tistory.com/175 2탄 : https://pabeba.tistory.com/176 3탄 : https://pabeba.tistory.com/178 어쩌다 보니 4탄까지 작성하게 되었네요. 어떤 영화를 보면 계속 후속작이 나오는데 솔직히 뒤로 갈수록 흥미가 떨어지더라고요. 아 근데 스파이더맨이랑 범죄도시는 재밌었습니다. 그래서 여러분들이 지루해하실까봐 이번 편을 마무리로 jQuery를 잠깐 보내주려고 합니다. 물론 다른 코드에서 나올 수도 있어요 ㅎㅎ 그래서 오늘은 중요한 Ajax 통신에 대하여 알아보도록 합시다. Ajax 통신 두가지를 알아보도록 하겠습니다. 텍스트만 받아오는 방식과 json을 받아오는 방식을 해보겠습니다. 텍스트 방식 1. script 를 ..
