" 묵묵히 갈 길을 갈 수 있는 것도 용기 "

오딘박스(OdinBOX), 혁신을 이룹니다.

JavaScript 6

글자 타이핑하는 효과를 주는 라이브러리 사용방법

라이브러리,자바스크립트,JS,JAVASCRIPT,오픈소스,깃허브 조금 더 이쁘게 보일 수 있는 방법은? 홈페이지를 만들게 되면 기능도 물론 신경을 써야 하지만 이용자가 들어오게 되면 먼저 보게 되는 디자인 요소를 생각해야 하는데 저 또한 홈페이지를 만들게 되면 제일 먼저 신경을 써야 하는 부분은 디자인이라고 생각합니다. 아무리 기능이 좋다고 하더라도 디자인이 좋지 않다면 이용하는 이용자 입장에서 매우 힘들 수 있다고 생각이 들기 때문입니다. 그래서 다양한 오픈소스 라이브러리들이 많지만 오늘은 타이핑 효과를 사용할 수 있는 라이브러리에 대해서 소개해드리려고 합니다. 목차 typewriter-effect 해당 라이브러리는 실제로 제가 홈페이지에서 사용을 했던 라이브러리입니다. 홈페이지에 처음 접속을 하게 되..

DEVELOPMENT 2022.06.26

웹(WEB/UX) 디자인 관련 참고할만한 사이트

웹,UI,UX,반응형,모바일,PC,데스크톱,디자인사이트,그래픽,JS,HTML,CSS WEB UI/UX 디자인 참고 해보세요! 웹사이트 디자인을 위해 혼자 창작으로 해내는 것도 좋겠지만 다른 웹사이트들은 어떤 식으로 만들어져 있는지 확인을 하면서 참고를 하는 것도 정말 필요한 과정 중 하나입니다. 예를 들어 자신이 만드려고 하는 홈페이지가 커뮤니티 관련 홈페이지라고 한다면 관련 커뮤니티 홈페이지를 확인을 하면 되지만 불편하기도 하고 다양한 사이트를 보는 것이 자신이 사이트를 만들 때 디자인 관련하여 더욱 도움이 된다고 생각합니다. 그럴 때 바로 필요한 사이트를 여러분에게 소개를 해드리려고 합니다. 웹사이트모음 굿디자인웹 국내 최우수 웹디자인 선정, 웹사이트. 굿디자인웹 www.gdweb.co.kr - 굿디..

DEVELOPMENT 2022.01.06

Bootstrap :: Modal 활용하는 방법

HTML,홈페이지,웹,개발,프로그래밍언어,자바스크립트(JS),Jquery)제이쿼리,웹,팝업,모달 팝업보단 모달을 쓰자! 일반적으로 우리가 웹페이지를 이용하다 보면 자주 볼 수 있는 화면이 있는 팝업과 함께 모달이 존재합니다. 저의 경우 처음 HTML이라는 것을 접했을 때는 팝업(pop-up)을 이용하여 어떤 필요한 정보를 출력을 하였는데 우리가 인터넷을 쓰다 보면 팝업창이 뜨면 내용을 정확히 보지도 않고 닫거나 불편하고 여러모로 크게 좋진 않아 어떻게 하면 좋을까 고민을 하다 모달(modal)이라는 것을 알게 되었습니다. 그래서, 여러분에게 팝업과 모달의 차이점에 대해서 간단히 알아보고 모달 사용방법에 대해서 알아보도록 하겠습니다. 목차 모달(Modal) VS 팝업(pop-up) 팝업(pop-up) 우선..

DEVELOPMENT 2021.08.27

[Node.JS] Node.JS로 이메일을 보낼 수 있는 방법

Node JS를 이용하여, 이메일 보내자 Node.JS nodemailer Module 먼저 NodeMailer 모듈을 사용하려면, npm을 이용하여, 설치를 해야합니다. 혹여나, npm이 설치되지않은 분이라면, npm을 먼저 설치하고 오셔야합니다. - 보통은 node.js 설치시 되어져있을겁니다. - npm(Node Package Manager/Modules)이란? Node.js 기반의 모듈 집합 저장소라고 생각하는게 편할 것같습니다. 정상적으로 설치가 되저여 있는지 확인하려면 $node -v를 입력하면, 현재 버전이 출력이 됩니다. "npm install nodemailer" 입력 후 실행 합니다. var nodemailer = require('nodemailer'); 이메일을 이제 보내보도록 하겠습..

19-09-19, 클라이언트 사이트 프로그래밍

클라이언트사이드 https://www.w3schools.com/ 하다가모르는거있으면 참고 splice 기억하자 c.(splice(startIndex, 제거할 개수, [추가할 항목들]) 배열 중간에 추가 삭제하는 것 c = [1, 2, 3, 4, 5] c.splice(1, 1) 제거 [2]ㅂㅂ c.splice(1,0,2) 추가하는 방법 [1.2.3] 중간고사 ㄱ c.splice(2,1,"ULSAN") 변환 c.splice(c.length-1,1) 제일 마지막꺼 ㅂㅂㅂ c.pop()이랑 똑같음 Client Side programming - 초보 > for 반복문 원하는 횟수만큼 반복 처리를 하고 싶을 때 사용 for 기본문법 for(초기문,조건문;종결문) { //반복처리내용 } 스코프 변수를 사용할 수 있는..

첫 강의, node.js 아톰 소개

클라이언트사이드 node.js 설명 : https://velopert.com/ 로드맵 : https://www.thinkwise.co.kr/ Node.js 설치 : https://nodejs.org/en/ 아톰 에디터 : https://atom.io/ Node.js 구글 크롬의 자바스크립트 엔진(V8 Engine) 기반의 서버 사이드 플랫폼 2009년 (Ryan Dahi) 개발 Node.js [Chrome V8 JavaScript 기반으로 빌드된 JavaScript 런타임] 이벤트 기반-논 블로킹(I/O모델) = 가볍고 효율적 Node.js 패키지의 '생태계' NPM -> 대규모 오픈 소스 라이브러리 Node 웹서버 X Node.Js는 그저 코드를 실행할 수 있는 하나의 방법에 불과한 JavaScript..