기술/JS19 json 파일 include 하는 방법 import 와 fetch 2가지 방법이 있다. import를 사용할 때 json 파일 대신 확장자를 js로 변경하고 script type="module"로 선언한다. import 사용할때 script type=moduleimport data from './test.js';console.log(data);/script export default{"fruit":"Apple","size":"Small","color":"Green"} fetch 사용할 때 scriptfetch('http://www.domain.com/test.json').then(function(response){retrun response.json();})/script {"fruit":"Apple","size":"Small","colo.. 2025. 3. 1. Grid Layout 쉽게 사용하기 egjs-grid.js 간헐적으로 필요한 레이아웃이다. 간단하게 CSS + HTML + JS로 구현해도 된다. 레이아웃 그대로 그려주는 상황이면 그래도 된다. 보통은 이 기능 붙여주세요, 저 기능 붙여주세요, 부드럽게 효과를 주면 좋겠어요 .. 커스텀의 세계로 깊숙이 들어간다. 최신 JS를 지원하는 환경이라면 egjs-grid.js 를 사용하면 한결 편하다. ES6를 지원해야 한다. https://naver.github.io/egjs-grid/storybook/?path=/story/introduction--page 만약에 ES5 엔진이면 UI/UX 개발담당자 공수가 꽤 들어간다. 게다가 경험이 없다면 대부분의 요청은 테스트 후 가능여부가 결정된다. Marsonry Layout으로 검색을 많이 하고, 여러 테스트 코드를 실.. 2025. 2. 28. 화살표 함수 Arrow Function 화살표 함수는 익명함수이다.기존의 익명함수를 매우 간단하게 한줄로 표현할 수 있다. 화살표 함수 작성하는 순서 기억법 1) 코드로 한줄로 바꾼다. 2) function 삭제, { } 삭제, 삭제한 { 위치에 => 를 작성한다. 3) return 을 삭제한다. // Arrow Function// always anonymousconst simplePrint = function(){ console.log('simplePrint');});const simplePrint = () => console.log('simplePrint');const add = function(a, b){ retrun a + b;};const add = (a, b) => a + b;const simpleMultiply = (a, b.. 2021. 1. 15. include js 파일 만들기 CSS 에서 @import 처럼 js 파일 불러오기 requiers.js 안쓰고 JavaScript 로 DOM 생성하는 방법으로 js 파일을 찍어서 포함시킨다. html TEST : JS Load JS 아래는 loader.js 소스 /** * loader.js */function load(files){ for (i=0; i 2021. 1. 14. Nest.js - Javascript Framework 네스트 자바스크립트 프레임웍 Nest는 확장 가능하고 안정적이며 효율적인 Node.js 서버측 애플리케이션을 구축하기 위한 JavaScript 프레임워크 이다.카밀 미슬위크가 제작해 2017년에 출시했다. Nest.js는 TypeScript와 JavaScript 상단에 구축되어 있으며 Angular로부터 많은 영감을 받았다. 또한 모듈/구성 요소 시스템을 따르고 재사용을 촉진한다. 가드, 파이프, 요격기 등의 개념을 기반으로 하며 WebSockets와 gRPC에 대한 내장 지원이 제공된다.좀 더 깊이 들어가 보면, Nest.js는 Express를 사용하며 많은 인기 있는 도서관들과 완벽하게 호환된다. |대부분의 추상화에 주로 클래스, 장식가, 메타데이터 반성을 사용한다. 관련링크Nest.js : https://nestjs.com/ .. 2019. 10. 13. Gatsby.js - Javascript Framework Gatsby.js 는 2019년 또 다른 훌륭한 자바스크립트 프레임워크다. 이 프레임워크는 React.js 기반으로 만들어졌다.카일 매튜스가 2015년에 처음 나왔지만, 2017년에 직장을 그만두고 자신의 사이드 프로젝트인 Gatsby.js and Typography.js에 풀타임으로 집중하기 시작했고, 그 해에 첫 버전이 나왔다. 블로그, 전자상거래 웹사이트, 대시보드 등을 포함한 동적 및 정적 웹 사이트/웹 앱을 만드는 데 사용할 수 있다. 데이터베이스 소스와 관련하여, Gatsby는 Markdown 파일, Contentful 또는 WordPress와 같은 CMS 또는 REST 또는 GraphQL API를 지원한다. 또한 Gatsby.js는 코드 분할, 이미지 최적화, 게으른 로딩, 리소스 프리페치 .. 2019. 10. 13. Next.js - Javscript Framework 2019 next.js는 React 응용프로그램의 서버측 렌더링을 더 쉽게 해주는 작은 JavaScript 프레임워크다. ZEIT가 만들어 2016년 오픈소싱했다. next.js는 React, Webpack 및 Babel을 사용하여 구축된다. 이 자바스크립트 프레임워크는 개발자들이 클라이언트측과 서버측 모두에서 동일한 렌더링 로직을 사용할 수 있도록 이등변형 리액트 애플리케이션을 작성할 수 있도록 하는 것을 목표로 한다.next.js는 HMR의 지원을 받는 단순한 클라이언트측 라우팅, 자동 코드 분할, Webpack 기반 개발 환경 등의 기능을 제공한다. 정적 및 온디맨드 내보내기라는 두 가지 서버측 렌더링 모드를 지원한다.정적 내보내기는 모든 페이지를 .html 파일로 렌더링하고 모든 파일 서버를 사용하여 서비.. 2019. 10. 13. Redactor - jQuery HTML5 WYSIWYG Plugin Redactor는 빠르고, 강력하며, 우수한 지원 팀을 가진 확장 가능한 편집기다. 지난 7년간 존재했고 현재에도 활발하게 개발 중이다. 아마존 S3에 이미지를 자동으로 업로드한다. 주요기능 75 KB minified Inline text editing CodeMirror support Drag and drop functionality for images Since the editor is plugin-based, it can be easily extended. 가격 관련링크 Redactor : https://imperavi.com/redactor/ Redactor WYSIWYG html editor Fantastic wysiwyg editor provides smooth and clean design,.. 2019. 10. 12. Trumbowyg - jQuery HTML5 WYSIWYG Plugin Trumbowyg는 HTML 편집기들 중 가장 가벼운 플러그 또는 그런 플러그인 중 하나다. 기존의 모든 WYSIWYG 편집기들은 45KB보다 크지만, TRumbowyg는 16KB에 불과하다. jQuery 버전 1.7 이상에서 동작한다. 주요기능 Only 16 KB 30+ Localisations 가격 MIT License 관련링크 Trumbowyg : https://alex-d.github.io/Trumbowyg/ Trumbowyg - A lightweight WYSIWYG editor by Alex-D / Alexandre Demode Lorem ipsum dolor sit amet, consectetur adipiscing elit, some text bold sed do eiusmod tempor.. 2019. 10. 12. 이전 1 2 3 다음
