본문 바로가기

자바스크립트와 캔버스

돈 뽑는 기계 무한으로 돈을 뽑아주는 기계가 있다면 어떨까요? 당장은 좋을지 몰라도 과도한 돈은 재앙이 된다고도 합니다. 적당한 수준에서 잘 관리할 수 있는게 뭐니뭐니해도 딱 좋지요. 그래도 돈을 실컷 눈으로라도 벌어보고 싶은 이웃님들을 위해(?) 만들어 보았습니다 :) 더보기
철창속 고양이 스크립트 공개! 기능을 좀 더 넣은 최종판입니다 :) 약속대로 스크립트를 공개합니다! 좀 스크롤 압박이 있을 수 있습니다 ㅎㅎ 코로나로 힘들어하는 분들이 모두 자유로워져 힘내시라는 의미도 있어요~ 동영상, 배경음악 모두 저작권은 무료이고 영상은 픽사베이의 저작권 표시의무가 없지만 배경음악은 Music: www.bensound.com 이라는 문구를 포함해야 하는 의무가 있습니다. 아래 내용 안 보이시면 여쪽으로 오세요 ~ 🥾🥾 http://dreamplan7.cafe24.com/canvas7/canvas3.htm 공 통통 dreamplan7.cafe24.com 더보기
강아지는 어딜 보는 걸까요? ( 자바스크립트 캔바스 ) 시작 후 화면 아무 곳이나 클릭해 주세요 :) 이 스크립트도 공개 예정입니다~ HTML 삽입 미리보기할 수 없는 소스 아무것도 안보이시면 여쪽으로 => http://dreamplan7.cafe24.com/canvas7/canvas2.htm 방문해주시는 모든 분들께 늘 감사드립니다. 재미있으셨다면 공감 한방, 댓글은 굿잡! 감사합니다~ 더보기
빗소리 스크립트를 공개합니다. https://itadventure.tistory.com/524 게시글에 사용된 빗소리 스크립트를 공개합니다. 배경이미지, 배경음악은 크레이의 홈페이지에 올려둔 것을 링크하였는데요. 여러분의 입맛에 맞는 걸 어딘가에 업로드하시고 적용하셔도 좋습니다. 아래는 홈페이지용, https://itadventure.tistory.com / 크레이의 IT탐구 아래는 티스토리 게시글용인데요. 티스토리에서는 HTML 모드 글쓰기로 전환하신 다음에 글을 써주셔야 해요. 배경이미지를 바꾸고 싶어요! 배경이미지를 바꾸고 싶으신가요? 어딘가에 마음에 드는 그림파일을 업로드하신 다음에, 아래 소스를 수정해 주시면 됩니다. 해상도는 화면에 걸맞는 사이즈로 편집해 주세요 // 배경 gm.bgImage = await loadImage.. 더보기
ASMR - 캔바스로 느껴보는 빗소리 ( 자바스크립트 ) 티스토리 게시글 내 비가 내려요. 웹브라우저 본문 아무데나 클릭하시면 빗소리가 들리실 겁니다. 휴식이 필요할 때 빗소리를 들어보며 여유를 누려보는건 어떨까요? :) # 3. 28일 스피커 버튼 추가 - 클릭시 소리 토글! 안되시는 분은 여기로 오세요~ http://dreamplan7.cafe24.com/canvas7/canvas1.htm 더보기
Node.js - Part13-2. 템플릿 예제 처음부터 시작하는 AWS와 Node.js 책자 본문 일부입니다. https://itadventure.tistory.com/493 [전자책 출간!] 처음부터 시작하는 AWS와 Node.js ( express ) 65 페이지 분량의 미리보기 책을 무료로 제공해드립니다 첨부파일을 다운로드하셔서 보시고 관심을 갖게 되신다면 그 때 구매하세요! 그동안 집필해본 '처음부터 시작하는 AWS와 Node.js' PDF 전자 itadventure.tistory.com 지난 이야기의 설명드린 내용대로 "내친 김에 만들어!" 보도록 하겠습니다. 참고로 랜덤 강아지 이미지를 제공하는 것은 해외 제공 오픈 API입니다. 템플릿을 활용하기 위해 ejs 모듈과 request 모듈을 설치해야 합니다. 새로운 폴더에서 또 시작해보도록 .. 더보기
Node.js - Part 12-3. 동적웹페이지 만들기 처음부터 시작하는 AWS와 Node.js 책자 본문 일부입니다. https://itadventure.tistory.com/493 [전자책 출간!] 처음부터 시작하는 AWS와 Node.js ( express ) 65 페이지 분량의 미리보기 책을 무료로 제공해드립니다 첨부파일을 다운로드하셔서 보시고 관심을 갖게 되신다면 그 때 구매하세요! 그동안 집필해본 '처음부터 시작하는 AWS와 Node.js' PDF 전자 itadventure.tistory.com 오늘은 좀 내용이 길어요~ 동적 웹페이지는 어떻게 만들면 되는 것일까요? app.get() 함수를 사용하시면 되는데요. 정적 웹 선언과 오류처리 사이에 배치해 주시면 됩니다. main.js 코드를 아래와 같이 수정해볼까요? const express=requi.. 더보기
Node.js - Part 12-1. 동적웹페이지? 그게 뭔데? 처음부터 시작하는 AWS와 Node.js 책자 본문 일부입니다. https://itadventure.tistory.com/493 [전자책 출간!] 처음부터 시작하는 AWS와 Node.js ( express ) 65 페이지 분량의 미리보기 책을 무료로 제공해드립니다 첨부파일을 다운로드하셔서 보시고 관심을 갖게 되신다면 그 때 구매하세요! 그동안 집필해본 '처음부터 시작하는 AWS와 Node.js' PDF 전자 itadventure.tistory.com 정적의 반대말은 동적이지요. 동적 웹페이지란 어떤 것일까요? 웹페이지가 막 걷기도 하거나 뛰기도 하거나 하는 등 움직이는 것일까요?... ^^; 이전 Part에서는 express 프레임워크에서 정적 웹사이트를 구성, 서비스하는 부분을 살펴 보았습니다. 정적인.. 더보기