Software Development/Web

웹 구현 필요사항 메모(JAVA script + google Sheet api)

huiyu 2020. 4. 3. 18:08

이번에 새로 간단한 프로젝트 진행하면서 참고한 웹페이지들 -> 정리할때 참고

HTML5 javascript

- canvas에 이미지를 그린다
- 그린 이미지 위에 text를 그린 후 이미지로 추출

- 입력할 text data는 구글 스프레드 시트에서부터 얻기(구글 스프레드시트 api활용)
- 구글 데이터만큼 위의 canvas를 생성 화면에 그려준다. 끝!

 

java script -  function

https://www.everdevel.com/JavaScript/return/

 

everdevel

웹 입문 사이트 에버디벨 - HTML, CSS, JavaScript, jQuery, MySQL ,PHP를 다룹니다.

www.everdevel.com

https://www.codingfactory.net/10386

 

JavaScript / 함수 / 함수 선언하고 호출하기

함수 선언하기 방법 1 function functionName( argument1, argument2, ... ) { // Do Something } 123 function functionName( argument1, argument2, [...]

www.codingfactory.net

java script - canvas에 이미지 그리기

http://blog.naver.com/PostView.nhn?blogId=ads226&logNo=220580333545

 

HTML5 Canvas의 이미지 붙이기

이번에는 canvas에 다른 이미지를 붙이는 method를 정리합니다. 더 자세한 설명은 아래의 두 페이지 링크를...

blog.naver.com

java script - dynamically create canvas

https://stackoverflow.com/questions/10652513/html5-dynamically-create-canvas

 

HTML5 Dynamically create Canvas

Hi there I have a question about dynamically creating a canvas using javascript. I create a canvas like this: var canvas = document.createElement('canvas'); canvas.id = "CursorLayer"; canvas....

stackoverflow.com

java script - Canvas 문자열그리기

https://m.blog.naver.com/PostView.nhn?blogId=javaking75&logNo=140170296812&proxyReferer=https%3A%2F%2Fwww.google.com%2F

 

HTML5 canvas - Canvas에 텍스트 출력하기 (fillText, strokeText, font)

HTML5 canvas - Canvas에 텍스트 출력하기 (fillText, strokeText, font) 1) 폰트와 텍스트 관련 주...

blog.naver.com

java script - 버튼 이벤트

https://minaminaworld.tistory.com/26

 

Javascript(자바스크립트),Jquery 버튼(button) 클릭 해보기 (onclick)

Javascript(자바스크립트),Jquery 버튼(button) 클릭 해보기 (onclick) Javascript(자바스크립트)로 input type=button과 button 이벤트

자바스크립트로 해보기

minaminaworld.tistory.com

 

java script - string to int

https://www.codingfactory.net/10390

 

JavaScript / 함수 / String() – 숫자를 문자열로 변환하는 함수

String() String()은 숫자를 문자열로 변환하는 함수입니다. 문법 String( object ) 1 String( object ) object [...]

www.codingfactory.net

java script - 문자열합치기

https://aljjabaegi.tistory.com/130

 

자바스크립트 문자열 합치기 javaScript concat() method

자바스크립트 문자열 합치기 javaScript concat() method 자바스크립트에서 문자열을 합칠 때는 concat() 메소드를 사용한다. - 사용방법 문자열.concat(합칠문자열1, 합칠문자열2....); 예) 1 2 3 4 5 6 7 8 <scr..< p=""> </scr..<>

aljjabaegi.tistory.com

java script - 기본문법

https://opentutorials.org/module/570/4962

 

[JavaScript] 조건문과 반복문 - JavaScript

자바스크립트의 조건문과 반복문은 대부분의 언어와 비슷하기 때문에 많은 부분을 생략합니다. if문 var date = new Date(); var hour = date.getHours(); if(hour < 11) { alert("아침"); } else if(hour < 15) { alert("점심"); } else { alert("저녁"); } switch문 var input = Number(prompt('숫자를 입력하세요.', '숫자')); switch

opentutorials.org

java script - image위에 text 안그려지던 문제

https://stackoverflow.com/questions/8429011/how-to-write-text-on-top-of-image-in-html5-canvas

 

How to write text on top of image in HTML5 canvas?

I want to display a image on canvas and insert a text on top of that image. window.onload = function() { var canvas = document.getElementById("myCanvas"); var context = canvas.getContext("...

stackoverflow.com

 

 

google sheet API - SELECT

https://kutar37.tistory.com/entry/%EA%B5%AC%EA%B8%80-%EC%8A%A4%ED%94%84%EB%A0%88%EB%93%9C%EC%8B%9C%ED%8A%B8-API-%ED%99%9C%EC%9A%A9%ED%95%98%EA%B8%B0-SELECT

 

구글 스프레드시트 API 활용하기 : SELECT

이번 포스팅에서는 갓구글의 스프레드시트 API를 활용해 보겠습니다. 구현하다 보니 한글포스팅은 오래된 것 뿐들이라 고생한 김에.. 최대한 간결하게 써 보려고 합니다. 목표는 웹에서 자바스크립트로 해당 스프..

kutar37.tistory.com

INSERT

https://kutar37.tistory.com/entry/%EA%B5%AC%EA%B8%80-%EC%8A%A4%ED%94%84%EB%A0%88%EB%93%9C%EC%8B%9C%ED%8A%B8-API-%ED%99%9C%EC%9A%A9%ED%95%98%EA%B8%B0-INSERT

 

구글 스프레드시트 API 활용하기 : INSERT

지난 포스트에 이어 구글 스프레드시트에 동적으로 데이터를 삽입해 보겠습니다. 먼저 스프레드시트 하나를 준비해 주세요. 저는 지난 포스팅에 썼던 시트를 쓰겠습니다. 스크립트 작성, 배포 시트가 준비되셨다..

kutar37.tistory.com

 

728x90