자바스크립트12 [Javascript] sort 배열 정렬 (오름차순, 내림차순, 날짜 정렬, 객체 배열 정렬, 효율성) [ 서론 ] 평소 내가 개발 및 관리하는 대부분의 구조는 Back 단과 Front 단이 나뉘어저 있다. Back 단은 jar 파일로 되어있어 한 글자라도 수정을 해야 하는 경우 서비스를 내렸다가 다시 올려야 하는 불편함이 있다. 이번에는 데이터를 정렬하는 문제가 있어 수정해달라는 간단한 문제가 있었다. 물론 데이터를 정렬하는데 있어 백엔드에서 해야 성능 효율성, 데이터 전송 및 네트워크 효율성, 보안 등 훨씬 좋지만 정렬 데이터가 많아야 10개 뿐인데 백엔드를 수정하기 싫어 그냥 프론트단에서 바꾸자 마자 바로 적용될 수 있는 방법을 수행하였다. [ 코드 예제 ] 해당 체널값을 출력해주는 프론트 단에서 날짜별로 내림차순 해달라는 간단한 내용이였다. new Date(b.crea.. 2024. 6. 27. NodeJS 이용한 엑셀 다운로드 및 차트 만들기 SpringBoot, NodeJS 코드로 Excel 파일을 생성하는 코드 이다. 여러 부분으로 나누어서 기록 후 보기위해 작성하였다. 상황에 따라 년, 월에 따라 엑셀을 자동으로 다운로드 받게 된다. 여기서는 NodeJs 단에 js 부분만 기록하였다. 1. 버튼 클릭 이벤트 핸들러 설정 $("#btnExcelDownSend").click(function(e){ e.preventDefault(); // ... }); $("#btnExcelDownSend").click: id가 "btnExcelDownSend"인 요소가 클릭되었을 때의 이벤트를 처리합니다. e.preventDefault(): 클릭 이벤트의 기본 동작을 중단시킵니다. 이 경우에는 버튼 클릭에 따른 기본 동작(예: 폼 제출)을 방지합니다. 2... 2023. 11. 16. Window, DOM 차이 자바스크립트 window.onload와 DOMContentLoaded 이벤트는 웹 페이지의 로딩 상태에 따라 다르게 동작하는 JavaScript 이벤트 이번 문제는 기존에 구현된 내용들을 참고하여 새로운 기능을 구현하면서 직접 짠 자바스크립트 내용을 추가하면서 문제가 발생하게 되었다. 기존 스크립트가 작동을 안하는 문제였다. 코드가 너무 오래되고 지저분한 부분도 있고 내 실력이 부족한 부분도 있어 이 문제를 해결하는데 생각보다 많은 시간이 들어 정리를하게 되었다. 자바스크립트의 실행 시점 때문에 발생하는 문제였다. 페이지 전체가 로드되기 전에 발생해야 하는 내용이였기 때문이다. 그런 이유로 문제의 원인은 DOMContentLoaded방식을 사용하여 해결하였다. window.onload 이벤트: 1. 이 이벤트는 웹 .. 2023. 9. 24. Markdown Viewer for Multiple Documents and Loader(배열이용) 랜더링 배경 연동 규격서나 다양한 정보를 모아놓은 자료실을 만들고 있다. 마크다운 정보를 DB에 넣고 자료를 관리하여 홈페이지에 내용을 띄울때는 자동으로 html로 변환하는 내용이였다. 하지만 바뀐 내용으로 정보의 양은 많지 않고 view ejs 부분 내용만 바꾸면 되기 때문에 서버를 재부팅할 필요없어 그냥 프로젝트에 정보를 넣어놓는 방식으로 바꾸기로 하였다. 그러나 ejs를 사용하면서 라우터 문제나 한 페이지 뷰를 만들기 위해서 프로젝트 구조상 index.ejs, js등 총 4개의 페이지를 새로 만들어야 한다는 문제점이 발생하였다. 만일 이 문제를 해결하지 않는다면 자료실에 1개의 내용을 추가한다면 4개의 페이지를 추가하거나 수정해야 한다는 문제점이 있어 .md 파일을 미리 만들어 놓고 자료실 페이지에서 이 .. 2023. 9. 11. 이전 1 2 3 다음
