검색결과 리스트
학습정리/by H2K에 해당되는 글 4건
- 2013.07.11 node.js, CORDOVA, PhoneGap
- 2013.07.08 javaScript, jQuery 함수
- 2013.07.07 NegotiatingViewResolver
- 2013.06.25 6.25
글
Node.js
자바스크립트엔진(V8) 위에서 동작하는 이벤트처리 I/O프레임워크
대부분의 자바스크립트가 웹 브라우저에서 실행되는 것과는 달리, Node.js는 서버 측에서 실행
실직적으로 서버사이드 자바스크립트 실행환경과 라이브러리, 이렇게 두 가지로 이루어져 있음
확장이 용이한 네트워크 프로그램을 쉽게 만들 수 있도록 함
많은 클라이언트 연결을 동시적으로 다룰 수 있음
CORDOVA
JS를 이용하여 native device 에 접근할 수 있도록 하는 device API set. 이것으로 HTML, CSS, JavaScript를 이용해 앱을 만들 수 있다.
Java, Objective-C 등의 native code 없이 앱을 만들수 있다.
JS 자체가 web 표준을 따르기 때문에, 대부분의 장비에서 별도 코드 수정 없이 사용가능한 앱을 만들 수 있다는 장점이 있다. Android, iOS, blackberry, Windows Phone, Palm WebOS, Bada, Symbian 모두 사용 가능하다.
PhoneGap
'학습정리 > by H2K' 카테고리의 다른 글
| javaScript, jQuery 함수 (0) | 2013.07.08 |
|---|---|
| NegotiatingViewResolver (0) | 2013.07.07 |
| 6.25 (0) | 2013.06.25 |
글
자바스크립트는 기본적으로 function()이면 getter, function(파라미터)는 setter로 쓴다....
javaScript
Event.preventDefault()
- 이벤트의 기본 동작을 취소한다.
- 개요
void preventDefault();
- 설명
이 메서드는 웹 브라우저로 하여금 이벤트와 연결되어 있는 기본 동작(존재하는 경우)을 수행하지 않게 만든다. 예를 들어, type 프로퍼티의 값이 'submit'이면 이벤트 전차 단계 중 어느 곳에서라도 이벤트 처리기에서 이 메서드를 호출함으로써 폼이 제출되는 것을 막을 수 있다. Event객체의 cancelable 프로퍼티가 false이면 기본 동작이 아예 존재하지 않거나 기본 동작이 수행되는 것을 막을 수 없다. 어떤 경우라도 이 메서드를 호출하는것은 아무런 영향을 주지 못한다.
Event.stopPropagation()
- 이벤트를 더 멀리 전달하지 않는다.
- 개요
void stopPropagation();
- 설명
이 메서드는 이벤트 전차를 중지시켜 이벤트가 다른 Document 노드로 전달되는 것을 막는다. 이벤트 전파 과정 중 언제라도 호출될 수 있다. 이 메서드는 동일한 Document 노드에 대해 다른 이벤트 처리기가 호출되는 것을 막지는 않지만, 이벤트가 다른 노드로 전달되는 것은 막는다.
자료출처: http://designonex.com/bbs/board.php?bo_table=G05_2&wr_id=341
자료출처: http://designonex.com/bbs/board.php?bo_table=G05_2&wr_id=340
jQuery
load()
- 전체 웹페이지를 새로고침하지 않고 웹페이지의 일부분만을 업데이트할 수 있다
on()
- $('body').on('click', '.detailLink', function(event){ } );
- body엘리먼트의 detailLink라는 클래스를 click하면 function(event){ } 를 실행하라
- jQuery 1.7버전 이상에서 사용 가능(이하버전은 live(), bind() ... 를 사용)
val()
- 선택한 엘리먼트의 값을 가져오는 함수
trigger()
- 클릭이벤트 강제로 발생시키기
-$(셀렉터).trigger(이벤트명)
'학습정리 > by H2K' 카테고리의 다른 글
| node.js, CORDOVA, PhoneGap (0) | 2013.07.11 |
|---|---|
| NegotiatingViewResolver (0) | 2013.07.07 |
| 6.25 (0) | 2013.06.25 |
글
ViewResolver(뷰를 찾아주는 해결사)란?
* 뷰의 이름과 로케일에 따라 적절한 타겟(뷰)을 찾아 인스턴스화하기 위해 스프링MVC가 사용하는 인터페이스로 Strategy패턴을 이용하여 작성되어 있다.
스프링은 여러가지 ViewResolver 인터페이스의 구현체를 제공하며, 모든 구현체들은 resolveViewName(String viewName, Locale locale) 메소드를 구현하고 있기 때문에 파라미터인 locale변수의 값에 따라 서로 다른 뷰를 반환하여 적절한(내가 원하는) 뷰를 찾아서 실행할 수 있다.
* 한줄요약: 특정한 뷰를 찾아서 실행시켜 주는 녀석
* spring에서 지원하는 다양한 뷰리졸버들.
UrlBasedViewResolver
* Dispatch-Servlet.xml에 NegotiatingViewResolver를 추가설정 하는 방법.(데이터는 JSON타입으로 넘기기로 한다..)
(참조: spring 3.2 docs 17.5.4 ContentNegotiatingViewResolver)
<bean class="org.springframework.web.servlet.view.ContentNegotiatingViewResolver">
<property name="viewResolvers">
<list>
<bean class="org.springframework.web.servlet.view.BeanNameViewResolver" />
<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix" value="/WEB-INF/view/" />
<property name="suffix" value=".jsp" />
</bean>
</list>
</property>
<property name="defaultViews">
<list>
<bean class="org.springframework.web.servlet.view.json.MappingJackson2JsonView" />
</list>
</property>
</bean>
* 보너스, JSON......?
난 자꾸 아래의 이분이 생각난다... 잘게잘게 썰어주시는 이분....
JSON (JavaScript Object Notation)은 경량의 DATA-교환 형식이다. 이 형식은 사람이 읽고 쓰기에 용이하며, 기계가 분석하고 생성함에도 용이하다. JavaScript Programming Language, Standard ECMA-262 3rd Edition - December 1999의 일부에 토대를 두고 있다. JSON은 완벽하게 언어로 부터 독립적이지만 C-family 언어 - C, C++, C#, Java, JavaScript, Perl, Python 그외 다수 - 의 프로그래머들에게 친숙한 관습을 사용하는 텍스트 형식이다. 이러한 속성들이 JSON을 이상적인 DATA-교환 언어로 만들고 있다....(참조: 위키)
라고 하는데... 예제 객체 하나 보는것이 더 빠른 이해가 될것 같다.
var json = {
name: "홓긿돟",
age: 20,
job: "thief"
}
이렇게 생긴 객체타입이다.....
'학습정리 > by H2K' 카테고리의 다른 글
| node.js, CORDOVA, PhoneGap (0) | 2013.07.11 |
|---|---|
| javaScript, jQuery 함수 (0) | 2013.07.08 |
| 6.25 (0) | 2013.06.25 |
글
1. Spring Framework에서의 FileUpload
2. Command Pattern을 이용한 PageController 관리
3. Filter & Interceptor
4. Mybatis의 Injection Mapping 기능을 이용하여 Dao 구현클래스 삭제
5. HTML기초
1. Spring Framework에서의 FileUpload
Controller에 관한 객체는 DispatchServlet에서 관여하기 때문에 FileUpload에 대한 것은 dispatch-servlet.xml 설정파일에 등록하여야 한다.
A. dispatch-servlet.xml
(스프링 Docs참고)17 .10.2. Using a MultipartResolver with Commons FileUpload
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<property name="maxUploadSize" value="1000000" />
</bean>
* Spring framework 2.5 미만에서는 아래 설정을 따르면 된다.
<bean id="multipartResolver" class="org.springframework.web.multipart.support.StandardServletMultipartResolver">
</bean>
B. Controller
* 파일 경로에 주의 한다
@Controller
@RequestMapping("/upload/upload")
public class FileUploadAction {
@Autowired
ServletContext ctx;
@RequestMapping
public String execute(@RequestParam("name") String name, @RequestParam(value = "age", defaultValue = "0") int age, @RequestParam("photo1") MultipartFile photo1, @RequestParam("photo2") MultipartFile photo2, Model model) throws Exception {
model.addAttribute("name", name);
model.addAttribute("age", age);
File photo1File = getNewFile();
photo1.transferTo(photo1File);
File photo2File = getNewFile();
photo2.transferTo(photo2File);
model.addAttribute("photo1", photo1File.getName());
model.addAttribute("photo2", photo2File.getName());
return "upload/upload";
}
private File getNewFile() {
String repositoryPath = ctx.getRealPath("/files");
String newFileName = "file_" + System.currentTimeMillis() + Math.random();
return new File(repositoryPath + "/" + newFileName);
}
}
C. JSP
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>업로드 결과</title>
</head>
<body>
이름: ${name}<br>
나이: ${age}<br>
사진1: ${photo1}<br>
<img src="../files/${photo1}"><br>
사진2: ${photo2}<br>
<img src="../files/${photo2}"><br>
</body>
</html>
2. Command Pattern을 이용한 PageController 관리
Command Pattern: 메서드의 호출을 캡슐화(클래스화) -> 메서드를 클래스화
왜 쓰나?
클래스 하나에 메서드가 계속 추가될 경우 문제점이 발생할 수 있기 때문에 거대화된 클래스의 메서드를 각각 분리
1. 클래스의 변경이 잦은 경우(유지보수 차원에서 메서드의 추가 변경이 잦다)
2. 이 클래스를 사용하는 다른 클래스가 영향을 받을 수 있고, 하나의 클래스에 많은 메서드가 있음으로 가독성이 떨어지게된다.
3. 메서드를 분리하여 각각 클래스화 함으로 문제를 해결
* 만약 한 클래스에 계속 메서드가 추가되는 상황이 발생하게 된다면 커맨드 패턴을 사용해서 클래스로 분리하라
여러 기능을 수행하는 메서드들을 가지고 있는 통합된 Action클래스인 EmployeeController.java
@Controller
@RequestMapping("/hr")
public class EmployeeController {
@Autowired
EmployeeDao employeeDao;
@InitBinder
public void initBinder(WebDataBinder binder) { }
@RequestMapping("/searchEmp")
public ModelAndView list(@RequestParam(defaultValue = "0") int deptno) throws Exception { }
@RequestMapping(value = "/addEmp", method = RequestMethod.GET)
public String addForm() throws Exception { }
@RequestMapping(value = "/addEmp", method = RequestMethod.POST)
public String add(Employee employee, BindingResult result) throws Exception { }
@RequestMapping("/retrieveEmp")
public String retrieve(@RequestParam("empno") int empno, ModelMap modelMap) throws Exception { }
@RequestMapping(value = "/updateEmp", method = RequestMethod.GET)
public String updateForm(@RequestParam("empno") int empno, Model model) throws Exception { }
@RequestMapping(value = "/updateEmp", method = RequestMethod.POST)
public String update(Employee employee, BindingResult result) throws Exception { }
@RequestMapping("/deleteEmp")
public String delete(@RequestParam("empno") int empno) throws Exception { }
}
각각 기능(메서드)을 갖는 클래스로 분리한다
@Controller
public class EmployeeAddAction {
@Autowired
EmployeeDao employeeDao;
@InitBinder
public void initBinder(WebDataBinder binder) { }
@RequestMapping(value="/hr/addEmp",method=RequestMethod.GET)
public String form() throws Exception { }
@RequestMapping(value="/hr/addEmp",method=RequestMethod.POST)
public String add(Employee employee, BindingResult result) throws Exception { }
}
@Controller
public class EmployeeDeleteAction {
@Autowired
EmployeeDao employeeDao;
@RequestMapping("/hr/deleteEmp")
public String execute(int empno) throws Exception { }
}
@Controller
public class EmployeeListAction {
public class EmployeeListAction {
@Autowired
EmployeeDao employeeDao;
@RequestMapping("/hr/searchEmp")
public ModelAndView execute(@RequestParam(defaultValue="0") int deptno) throws Exception { }
}
@Controller
public class EmployeeUpdateAction {
public class EmployeeUpdateAction {
@Autowired
EmployeeDao employeeDao;
@InitBinder
public void initBinder(WebDataBinder binder) { }
@RequestMapping(value="/hr/updateEmp", method=RequestMethod.GET)
public String form(int empno, Model model) throws Exception{ }
@RequestMapping(value="/hr/updateEmp", method=RequestMethod.POST)
public String execute(Employee employee, BindingResult result) throws Exception { }
}
@Controller
public class EmployeeDetailAction {
public class EmployeeDetailAction {
@Autowired
EmployeeDao employeeDao;
@RequestMapping("/hr/retrieveEmp")
public String execute(@RequestParam("empno") int empno, ModelMap modelMap) throws Exception { }
}
3. Filter & Interceptor(핸들러 인터셉터)
Filter:
인터페이스 javax.servlet.Filter를 구현한 클래스로 다음의 메서드를 갖는다
init(FilterConfig arg0)
doFilter(ServletRequest request, ServletResponse response, FilterChain next)
destroy( )
Interceptor:
추상클래스 org.springframework.web.servlet.handler.HandlerInterceptorAdapter를 상속받은 클래스로 다음의 메서드를 갖는다
preHandle(HttpServletRequest request, HttpServletResponse response, Object handler)
postHandle(HttpServletRequest request, HttpServletResponse response, Object handler, ModelAndView modelAndView)
afterCompletion(HttpServletRequest request, HttpServletResponse response, Object handler, Exception ex)
공통점: PageController의 실행 전,후로 꽂아넣을 수 있는 기능을 수행한다(ex.암호화, 복호화 등..)
차이점: Filter는 FrontController인 DispatchServlet 앞에, Interceptor는 뒤에 위치한다
* 인터셉터 내부 메서드의 실행순서
preHandler() -> Action실행 -> posthandler() -> JSP실행 -> afterCompletion()
* 언제 인터셉터를 사용하나?(인터셉터를 사용하는 예)
Request부터 Response까지의 시간을 측정할 때 사용한다.
어떤 부분이 실행중 일 때 지연시간이 큰지 알아낼 수 있다(인터셉터 내부 메서드 실행순서를 이용)
* 인터셉터를 사용하기 위해서는 dispatch-servlet.xml에 아래와 같이 설정을 등록하여야 한다.
<bean id="handlerMapping" class="org.springframework.web.servlet.mvc.annotation.DefaultAnnotationHandlerMapping">
<property name="interceptors">
<list>
<ref bean="testInterceptor"/>
</list>
</property>
</bean>
<bean id="testInterceptor" class="bit.java39.interceptors.TestInterceptor"/>
</beans>
4. Mybatis의 Injection Mapping 기능을 이용하여 Dao 구현클래스 제거
* Dao인터페이스와 Mapper.xml 설정파일만으로 실행 가능하다(Mybatis 3.0이상에서 정상 작동한다)
참고자료: http://mybatis.github.io/spring/mappers.html#scan
MapperScannerConfigurer
<bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
<property name="basePackage" value="org.mybatis.spring.sample.mapper" />
</bean>
<property name="basePackage" value="org.mybatis.spring.sample.mapper" />
</bean>
Dao의 설정에 관여하는 services.xml에 추가하여 사용한다.(Dao의 메서드와 Mapper의 ResultType에 주의)
services.xml에 설정추가
<bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
<property name="basePackage" value="bit.java39.dao" />
</bean>
EmployeeDao.java 인터페이스
public interface EmployeeDao {
public interface EmployeeDao {
List<Employee> getEmployeeList(int departmentNo) throws Exception;
int insert(Employee employee) throws Exception;
Employee getEmployee(int empNo) throws Exception;
int delete(int empNo) throws Exception;
int update(Employee employee) throws Exception;
}
EmployeeMapper.xml설정
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="bit.java39.dao.EmployeeDao">
<select id="getEmployeeList" resultType="Employee">
select
e.empno as no,
e.ename as name,
e.job,
e.sal as salary,
d.dname as departmentName,
d.loc as departmentLocation,
m.ename as managerName
from emp e
left join dept d on e.deptno=d.deptno
left join emp m on e.mgr=m.empno
</select>
<insert id="insert" parameterType="Employee">
insert into emp (empno,ename,job,mgr,hiredate,sal,comm,deptno)
values (
#{no}, #{name}, #{job}, #{managerNo},
#{hireDate}, #{salary}, #{commission}, #{departmentNo})
</insert>
<select id="getEmployee" parameterType="int" resultType="Employee">
select
empno no,
ename name,
job,
mgr managerNo,
hiredate,
sal salary,
comm commission,
deptno departmentNo
from emp
where empno=#{value}
</select>
<delete id="delete" parameterType="int">
delete emp where empno=#{value}
</delete>
<update id="update" parameterType="Employee">
update emp set
ename=#{name},
job=#{job},
mgr=#{managerNo},
hiredate=#{hireDate},
sal=#{salary},
comm=#{commission},
deptno=#{departmentNo}
where empno=#{no}
</update>
</mapper>
5. HTML
A. Semantic Web(구조화된 웹): 각각 태그에 의미를 부여한다(태그의 용도대로 사용하자)
B. DOM: HTML 엘리먼트를 객체화시켜 tree구조로 관리
C. block 태그: 라인을 점유하는 태그들(라인의 변경)
inline 태그: 라인속에 참여하는 태그들(라인이 바뀌지 않는다)
D. Doctype
block 태그
-> <h*> 헤더태그
-> <p> 문단태그
-> <ol> 순서있는줄태그
-> <ul> 순서없는줄태그
-> <li> 라인아이템태그
-> <div> 분할태그
-> <address> 주소태그
-> <blockquote> 인용문태그
inline 태그
-> <a> 앵커태그
-> <i> 이탤릭체태그
-> <b> 볼드체태그
-> <em> 엠퍼사이즈태그
-> <span> 확장태그
-> <img> 이미지태그
-> <q> 인용문태그
* 각 태그에 대한 자세한 설명은 검색하면 잘 나오므로 알아서 찾아보자.....
'학습정리 > by H2K' 카테고리의 다른 글
| node.js, CORDOVA, PhoneGap (0) | 2013.07.11 |
|---|---|
| javaScript, jQuery 함수 (0) | 2013.07.08 |
| NegotiatingViewResolver (0) | 2013.07.07 |
RECENT COMMENT