본문 바로가기

2016/08

[JS] Json알아가기(Hashmap, List, Array, Value) # Json에 대해 알아보자. Why? Client(Javascript) Spring(Server) 사이에서 데이터를 주고받기위해 Json방식으로 사용하는데 정확히 무엇인지 개념을 짚고넘어가자. Refer Json의 개념알고가기 (난이도 : 쉬움) 생활코딩 - Json ~ Ajax So json은 JavaScript Object Notation 의 약자로서, 의미그대로 해석하면 JavaScript에서 객체를 만들 때 사용하는 표현식을 의미한다. json은 클라이언트와 서버간의 데이터를 주고받을 때 사용할 수 있는 표현의 하나이다. 자바 스크립트는 객체를 { } 대괄호 로 표현한다. 그래서 Json데이터의 구조의 첫 시작은 { 로 시작하며(객체이다) “Key값(name)” 과 “Data(value)” 로 .. 더보기
[Nodejs] Express를 사용한 HTML 라우팅(Routing) / Webstrom개발환경/ Express / # Express를 사용한 HTML 라우팅(Routing) Why? 프로젝트 방향이 Node는 웹 화면을 띄우기위한 웹 서버 역활로 확정. 데이터는 Spring서버를 이용하기로 결정. 따라서 Node에서의 역할은 라우터를 이용하여 주소별로 웹을 나뉘어주는 역할. How ? Server / Route / View로 구성하여 역할을 구분. Server - ‘Express’ 사용, EJS사용 , 라우터 경로 설정 Router - 접속경로( 회사 / 고객페이지) 에 따라 경로구분. View - Html기반의 화면소스 (+부트스트랩) Problem 생활 코딩 및 블로그에서는 화면부분에 HTML이 아닌 EJS를 사용하여 출력을 하는데, 그렇게되면 현재 html로 제작된 페이지를 모두 ejs로 변환해야한다. 라우터(.. 더보기
[Nodejs] 'Express' 사용하기. Express 도입 Refer http://expressjs.com/ko/ Express들어가기전 웹 서버 소스설명 //Server.js const http = require('http'); const hostname = '127.0.0.1'; const port = 1337; // 포트번호=1337 //CreateServer를 통하여 서버생성 http.createServer((req, res) => { res.writeHead(200, { 'Content-Type': 'text/plain' }); res.end('Hello World\n'); }).listen(port, hostname, () => { //listen동작 실시(1337포트번호로 접속했을 때) console.log(`Server runn.. 더보기
[Nodejs] Nodejs 시작하기 Why? 프로젝트 진행 중, 쇼핑몰(Web)은 Node서버를 연동하여서 진행해보라는 PM(강사)님의 말씀으로 Node서버 구현을 맡게되었다. 시작하면서 느끼는것은 Spring-Tomcat 서버 적용할 때와 느낌이 비슷하여 이해하는부분에서는 수월하게 이해가 진행되었다. Refer 생활코딩 - Nodejs Nodejs 강좌 Blog 현재까지 두개의 사이트를 번갈아 가며 배우고 있다. 생활코딩은 이론 위주로 , Blog는 Express의 사용 및 실습 위주로 진행 중. #Node.js란? 자바스크립트가 등장 -> 동적인 Web으로 변화 자바스크립트 -> WEB의 울타리안에서 활동범위로 한정되어있었다. 구글에서 자바스크립트 기반의 V8엔진 오픈소스 공개. Web이 아닌곳에서도 사용이 가능해짐(탈Web화) (V8.. 더보기
[Spring] 스프링 부트(Spring Boot) 프로젝트 생성 시 오류 Spring Boot 프로젝트 생성 시 Maven(Library) 오류 해결하기 Cause 프로젝트 생성 시 Pom.xml에서 Maven에 빨간 밑줄 발생. 에러 문구 failure to transfer org.springframework ... Missing artifact org.springframework.boot:spring-boot-starter-parent:jar:1.3.2.RELEASE Why? 스프링부트 프로젝트 생성하였는데 오류가 발생(위에 오류메시지) 기존에 존재하던 Library 오류가 원인 가능성 높다. Solution 기존의 라이브러리를 삭제 -> 다시 다운로드 진행 ” C:\사용자폴더\사용자계정폴더\m2 ” 로 진입. m2폴더 안에 repository 폴더를 삭제(Spring을 .. 더보기
[App]Jsoup / URL을 통한 날씨 데이터 파싱(Pasing)하기 오늘은 안드로이드에서 네이버의 날씨 데이터를 파싱하여 가져오는 간단 소스를 포스팅. 핵심 기능 - 날씨 데이터를 가져오는 2가지 방법 - Jsoup / URL방식 사용 (MainActivity.java 참고) - AsyncTask 을 사용하여 네트워크 작업을 실시 - AsyncTask result = weatherConnection.execute("",""); - AndroidManifest.xml에서 Internet-permission(권한)을 주어야한다. - - activity_main.xml에서 화면 Background 변경 - @drawable/bg1 App 배경화면 설정 - 사용할 배경화면을 drawable 폴더에 이미지파일을 넣는다.- 가운데에 안드로이드 화면에서 배경을 마우스로 클릭해주자. .. 더보기
[CSS] Float 속성 및 Clear속성 설명. #CSS Float과 Clear 사용하기 Why? CSS레이아웃 잡기위하여 알아보는 중 대충 알고있던 CSS 에서 Float 기능 짚고 넘어간다. Refer Float 알고가기 - http://www.nextree.co.kr/p8796/ 내용 링크사이트에 들어가서 글씨가 있더라도 귀찮게 생각하지말고 천천히 처음부터 끝까지 한번만 읽어볼것. float이란? float 속성은 특정 요소를 떠 있게 하는 것입니다. 기본 레이아웃 흐름에서 벗어나 요소의 모서리가 페이지의 왼쪽이나 오른쪽에 이동하는 것입니다. float 속성을 사용할 때 요소의 위치가 고정되면 안 되기 때문에 position 속성의 absolute를 사용금지 float 속성을 사용하지 않으면 요소들이 수직으로 출력됩니다. float:left 속성.. 더보기
[MD] 마크다운 + Prettyprint 소스코드 포스팅 #Intro 지난 포스팅은 MD문서를 HTML로 변환하여 블로그와 Github에 둘다 빠르게 포스팅하는 방법을 게시하였습니다. 이번 포스팅은 prettyprint를 사용하여 소스코드 하이라이팅 시키는 방법을 이어가겠습니다. Why? 소스코드 하이라이팅 툴은 여러가지가 있는데 왜 prettyprint를 사용하는지? (링크)하이라이팅 툴 종류 및 장 단점 1 - StackEdit는 마크다운 소스코드 첨삭 시 아래와 같이 pre태그 Class prettyprint사용 /*소스코드 입력*/ (참조 : 링크). 2 - 티스토리 html편집 -> Prettyprint를 적용 -> 소스코드를 MD로 작성 및 업로드 -> Prettyprint를 사용하는 모든 소스코드에 하이라이팅 효과적용 티스토리 Html 편집하기 (.. 더보기
[MD]티스토리(블로그)에 마크다운 포스팅하기 #티스토리 마크다운으로 포스팅하기 Why? 마크 다운을 알게된 이후로 어떻게하면 Github에도 올린 자료를 티스토리로 간단하게 올릴 방법을 찾는 중 나의 고민을 해결해준 블로그 발견. 티스토리에 마크다운 블로깅 (인상깊게 본 자료는 블로그 WorkFlow를 만들어 순서도를 잡은 부분) 링크에서의 블로그분은 Sublime - StackEdit(Html변환) - T스토리(블로그) 순서, 나는 조금은 다르게 StackEdit(MarkDown작성) -> Github / Gist 게시 StackEdit(Html변환) -> 티스토리(블로그) 포스팅 이렇게 두가지 방법으로 계획. StackEdit 사용하기 Stackedit는 설치프로그램이 아닌 Web에서 직접 작성하여 실시간으로 컨버팅되는것을 확인할 수 있는 장점.. 더보기
[Spring]게시판 페이지 번호 구현하기(페이징) #게시판 페이징 처리(Spring)개발환경Server - Java(Spring)사용 Web - Jsp사용 게시판에서 페이징 리스트를 사용하기위하여순서현재 페이지번호를 Web으로부터 받아올것 ,게시판 게시글 갯수(Count) 값을 가져올것,갯수와 현재 페이지 번호를 가지고 페이징 알고리즘을 활용하여 End페이지 계산 및 Prev,Next버튼 생성소스코드Controller(server) @RequestMapping(value = "/list", method = RequestMethod.GET) public String list(PageMaker pagemaker, Model model) { logger.info("START LIST"); int count = 0; pagemaker.setPage(pagema.. 더보기

티스토리툴바