728x90
반응형
SMALL

스마트한 개발 공부/Node.js | Java | html 11

[Node.js] 부트스트랩으로 그래프 그리기(router 사용)

MES 시스템 서비스 위한 웹페이지를 만들다가 설비 가동률을 그리기 위해 여러 자료를 찾던 중, router를 사용하는 경우는 별로 없다는 사실을 알게되었다. 꺽은선 그래프는 부트스트랩을 통해서 차트를 그리는 방법을 선택했다. router를 처음 시작하기 위한 설정이나, 실행 index.js 파일에 대한 설명은 생략하려고 한다. 상단에 header 파일을 호출했다. Capacity utilization 버튼을 클릭하면 graph.ejs를 get 방식으로 호출한다. // routes 폴더의 main.js에 graph.ejs 를 get방식으로 호출 router.get("/graph",function(req,res){ res.render("graph"); }) 다음은 graph.ejs 파일 구성이다. //gr..

[JavaScript] Ajax를 사용하여 간단한 웹페이지 만들기

1. Ajax란? Ajax란, JavaScript의 라이브러리중 하나이다. 브라우저가 가지고 있는 Request 객체를 이용해서 전체 페이지를 새로 고치지 않고 페이지의 일부만을 데이터를 로드하는 비동기 방식 기법이다. 즉, 쉽게 말하자면 자바스트립트를 통해서 서버에 데이터를 요청하는 것이다. 1.1 비동기 방식이란? 웹페이지를 리로드하지 않고 데이터를 불러오는 방식이며 Ajax를 통해서 서버에 요청한 후 멈추어 있는 것이 아니라 그 프로그램은 계속 돌아간다는 의미이다. 페이지 리로드의 경우 전체 리소스를 다시 불러와야하는대 이미지, 스크립트, 기타 코드등을 모두 재요청할 경우 불필요한 리소스 낭비가 발생할 수 있게 되지만 비동기식 방식은 필요한 부분만 불러와 사용할 수 있다는 장점이 있다. 1.2 장점..

[Node.js] Node.js에서 사용하는 MySQL

js파일에서 MySQL 데이터를 사용하는 방법에 대해 알아보자. 자주 사용하는 select, update, delete, insert 4개를 보려고 한다. query 를 불러올 때 사용되는 ` 표시는 키패드 1번 왼쪽에 있는 기호니 주의하시길 바란다! 설명할 때, column의 값을 필드명으로 column 안에 있는 값들을 필드값이라고 정의하고 시작하겠습니다. mysql을 통한 데이터는 OBJECT 함수의 파라미터로 name1, value1, name2, value2 처럼 key: value 쌍을 맞춰서 호출과 입력이 이루어진다. 1. select connection.query( `select * from DB명`, function(err,result){ if(err){ console.log(err); ..

[jQuery] html에서 jQuery를 사용하는 방법

제이쿼리(jQuery)는 오픈 소스 기반의 자바스크립트 라이브러리이다. 제이쿼리는 웹 사이트를 만들 때 자바스크립트를 더 쉽게 사용할 수 있도록 만들어준다. 제이쿼리를 사용하면 짧고 간단한 코드로도 웹 페이지에 다양한 효과나 연출을 적용할 수 있기 때문에 가장 인기 있는 자바스크립트 라이브러리 중 하나이다. 80%가 넘는 웹 사이트에서 jQuery를 사용한다고 한다. jQuery 사용방법 1. 직접 라이브러리를 다운받아서 사용하는 공간에 추가하여 적용 2. url을 복사해서 script src의 속성값으로 전달 jQuery 문법 jquety는 $로 시작한다. jquery는 인자값으로 CSS selector를 줄 수 있다. 사용 예시 : $(제어대상).동작함수(); jQuery 예시 1. Document ..

[Node.js] Node.js에서 mysql을 이용하여 웹서비스 만들기 #2

2021.07.05 - [스마트한 코딩 공부] - [Node.js] Node.js에서 mysql을 이용하여 웹서비스 만들기 #1 [Node.js] Node.js에서 mysql을 이용하여 웹서비스 만들기 #1 2021.07.02 - [스마트한 코딩 공부] - [Node.js] Node.js 로 간단한 웹서비스 만들기 #2 [Node.js] Node.js 로 간단한 웹서비스 만들기 #2 2021.07.02 - [스마트한 코딩 공부] - [Node.js] Node.js 로 간단한 웹서.. smartseoullife.tistory.com 저번시간에는 mysql을 설치했는데 이번에는 node.js과 연동하여 사용해보자. 2021.07.02 - [스마트한 코딩 공부] - [Node.js] Node.js 로 간단한 ..

728x90
반응형
LIST