본문 바로가기

Back-end/웹(web)19

JSP 에러 처리 | ORA-071747, json 값 반환시 주의 https://m.blog.naver.com/PostView.naver?isHttpsRedirect=true&blogId=geeyoming&logNo=220247100266 [에러] ORA-01747: invalid user.table.column, table.column, or column specification ▣ ORA-01747: invalid user.table.column, table.column, or column specification 프로그램 내에서 갑... blog.naver.com JSON 값 파싱 에러 JSP 에서 POST로 넘어온 값을 xxx.jsp에서 DB 접근 클래스에서 처리후 다시 값을 반환할 때 JSON 값이 파싱이안됨. out.print(jsonArr.toJSONStr.. 2022. 5. 3.
JSP Dynamic 웹 프로젝트 생성 이클립스에서 새 프로젝트 생성시 New Dynamic Web Project 이때 Tomcat Server 를 사용하는데 웹 애플리케이션 서버로 JSP코드가 포함되어 있는 웹 페이지를 만들어 준다. 웹 애플리케이션(WAS) 는 동적인 데이터를 처리하기 때문에 DB 와 연결하여 데이터를 주고 받을 수 있다. https://tomcat.apache.org/download-90.cgi Tomcat은 해당 사이트에서 사양에 따라 zip 파일을 다운 받으면 된다. Next 모듈명과 경로지정 자바 버전 1.8로 설정 초기 시작시 실행이 안될 수 있는데 Servers\server.xml 에서 포트 번호를 변경시켜주어야한다. 실행시 크롬 브라우저로 뜨게 설정 JSP 파일 인코딩 UTF-8 으로 설정 JSP 파일 생성시 .. 2022. 4. 8.
CSS - Flexbox 플렉스 박스 Flexbox CSS3 의 최신 레이아웃 모델. Display 속성을 사용함. float 를 대체하며 더 효율적으로 사용. 가로 세로로 아이템들을 정렬. 아이템들의 순서나 비율등을 쉽게 적용. flex: 200px; 각 요소에 적어도 200px 너비가 지정되었다는 의미 flex-direction row , row-reverse, column, column-reverse HTML 삽입 미리보기할 수 없는 소스 flex-wrap wrap, wrap-reverse (자리가 없으면 내려감) nowrap flex-flow: row wrap; flex-direction, flex-wrap 으로 대체 flex-direction: row; flex-wrap: wrap; align-items 정렬 제어 align-ite.. 2022. 3. 31.
CSS - 기본 정리 CSS /* */ 주석 초기화 코드 Eric Meyer’s Reset CSS HTML5 Doctor CSS Reset YUI reset CSS id 선택자 하나의 요소 #header{ ...} 값 클래스 .클래스 { .. } .container > .child-box li.select { color: red; } // li 태그중 class 속성이 select를 가지는 태그 // 선택자 * 모든 태그 선택 / CSS reset file에서 주로 사용 선택자 { 스타일속성 : 스타일 값; } 선1, 선2 ...{ margin:0; padding:0; } 속성 선택자 선택자[속성] 선택자[속성="값"][속성="값"] input[type="test"]{ background: red; } //input 태그 중.. 2022. 3. 30.
HTML - 태그 Visual Code 태그 생성 간단 단축키 body + tap키 -> li*20 -> li 20개 생성 li>a*20 -> li속에 a 태그 20개 생성 (li>a)*20 -> li에 a 가 포함 nav#navId -> 아이디 생성 nav.navClass -> 클래스 생성 li.item$3*5 -> 클래스명 3부터 5개 공간태그 div block span (줄안)inline 일렬로 글자형태 text h1 h2 h3 h4 h5 제목글자 b 굵은 글자 강조 글자 노랑색 배경 i 기울어진 글자 small 작은 글자 sub 아래 달라붙 sup 위에 달라붙 ins 밑줄 글자 del 가운데에 줄 p 본문 글자(텍스트 단락) 2022. 3. 9.
AMP : Accelerated Mobile Pages AMP는 지연없이 페이지에 바로 액세스 가능하게 하는 프레임워크로 다양한 웹기반의 기술을 사용해 모바일 웹의 성능을 높이기 위한 목적을 가지고 있다. AMP는 AMP Websites , Stories , Ads, Email 이 있으며, AMP Stories 에 대해서 알아보았다. AMP stories An open format for visual storytelling on mobile AMP 는 모바일 겨냥하여 개발되고 있고 데스크톱도 지원하고 있다. AMP Stories 는 open web으로 된 시각적인 스토리 텔링 도구라고 볼 수 있다. 전체 화면에서 이미지, 동영상, 그래픽, 오디오 등으로 정보를 전달하는 시각적 스토리텔링 도구로, 읽기 간편하고 시각적으로 풍부한 콘텐츠 제공한다. 주로 콘텐츠가.. 2021. 2. 21.
express multer 파일 업로드 https://www.npmjs.com/package/multer multer Middleware for handling `multipart/form-data`. www.npmjs.com Multer는 파일 업로드를 위해 사용되는 multipart/form-data 를 다루기 위한 node.js 의 미들웨어 효율성을 최대화 하기 위해 busboy 를 기반으로 하고 있다. //npm install --save multer var multer = require('multer') var upload = multer({dest : 'uploads/'}) //파일 담는 곳 app.set('view engine','ejs') app.set('views', './views') app.get('/upload',(req.. 2020. 9. 23.
express get방식 post방식 GET 과 POST 네트워크 전송 방식이다. GET 방식은 어떠한 데이터를 전달 해주는 방식이라면 POST 방식은 데이터의 값을 변경하는 방식, 암호화 형태로 전송 GET 방식 const express = require('express') const app = express() app.get('/',function(req, res){ res.send('Hello home page') })//get 방식에 홈으로 들어온 사람들 app.get('/login',function(req,res){ res.send('Login please') //정적 웹페이지 표현 }) app.get('/dynamic', function(req, res){ //동적 표현 var lis = ''; for(var i=0; i브라우저로.. 2020. 9. 23.
nodejs 프레임워크 express 로 서버 설치, 설정 https://expressjs.com/en/starter/installing.html Installing Express Installing Assuming you’ve already installed Node.js, create a directory to hold your application, and make that your working directory. $ mkdir myapp $ cd myapp Use the npm init command to create a package.json file for your application. For more inform expressjs.com Installing 종료는 ctrl + c 커멘드에서 서버 실행시 서버 수정이 있으면 껐다가 다시 켜야한다. .. 2020. 9. 22.
부트스트랩 활용할 수 있는 템플릿 https://getbootstrap.com/docs/4.5/getting-started/introduction/ Introduction Get started with Bootstrap, the world’s most popular framework for building responsive, mobile-first sites, with BootstrapCDN and a template starter page. getbootstrap.com 부트스트랩 활용할 수 있는 템플릿 2020. 7. 29.
API을 이용한 책 검색 ,ajax, kakao api API 1 jquery cdn CDN은 “느린 응답속도/다운로딩 타임”을 극복하기 위한 기술 디지털화될 수 있는 모든 데이터를 CDN을 통해 전송할 수 있다. https://cdn.hosting.kr/cdn%EC%9D%B4%EB%9E%80-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80%EC%9A%94/ cdn.hosting.kr 2 ajax $.ajax({ method: "POST", url: "some.php", data: { name: "John", location: "Boston" } }) .done(function( msg ) { alert( "Data Saved: " + msg ); }); 3 api 키 발급 https://developers.kakao.com/console/.. 2020. 7. 27.
웹프로그래밍 JSP 기초 문법 정리 JSP 최초 클라이언트 요청이 들어올 때 서블릿으로 변환 JSP에 작성한 소스코드는 변환 servlet의 _jspService 메소드에 들어감 JSP 문법 6가지 요소 스크립틀릿 표현식 선언부 지시자 표현식 언어 액션 스크립틀릿 : JSP 내에 자바 코드 삽입 표현식 선언부 지시자 include 지시자 JSP페이지나 HTML을 현재 JSP 페이지의 일부로 만들기위해 주로 헤더나 푸더를 조립할 때 정적 JSP URL맵핑은 web.xml에서 /패키지명/X.jsp 내장변수 : JSP 페이지 안에 선언을 하지 않고도 사용할 수 있는 변수 request, respones, out, application, config, pageContext, session, exception out 변수는 출력 버퍼 사용 out... 2020. 7. 16.