![]()
파이참을 설치하고 Hellow World 를 찍는 방법을 알아보겠습니다. 설치하고 첫 화면에서 New Project를 선택해줍니다. 원하는 프로젝트명을 입력해 준후 Create 를 선택해 줍니다. 그러면 파이썬을 실행하기 위한 것들을 자동으로 설치 후 위와 같이 main.py 파일이 자동으로 생성 됍니다. 프로젝트를 우클릭 후 New -> Python File 을 선택하여 주고 파이썬 파일명을 입력 후 Enter! 위와 같이 파이썬 파일이 생성된것을 확인할 수 있습니다. 코딩의 기본인 헬로우 월드를 출력하기위해 print("Hellow, World!") 를 코딩 후 프로젝트 우클릭 -> Run 프로젝트명 을 선택해 주면 위와 같이 결과가 잘 출력된 것을 확인 할 수 있습니다.
![]()
파이참 파이참(PyCharm)은 가장 유명한 파이썬 에디터 중 하나로서 코드를 작성할 때 자동 완성, 문법 체크 등 편리한 기능을 많이 제공합니다. 파이참은 공식 다운로드 사이트(http://www.jetbrains.com/pycharm/download)에서 내려 받을 수 있습니다. 저는 윈도우에서 사용하기에 Windows 클릭 후 우측 커뮤니티 버전이 무료라 커뮤니티 Download를 클릭해 줍니다. 그러면 다음과 같이 자동으로 다운로드가 되는 것을 확인 할 수 있습니다. 다운로드 된 파일을 실행시켜주면 위와 같이 설치하기 위한 화면이 나옵니다. 이제 Next를 클릭해서 진행을 해주면 됩니다! 설치할 위치를 선택하여 주고 설치 옵션선택 창이 있는데 전 전부 다 선택하여 진행하였습니다. 여기서 Insta..
![]()
콘솔창에 이런식으로 DEBUG- batch acquisition of 0 triggers 이게 주기적으로 뜨는데 log4j의 로그 레벨 관련한 문제인데 src/main/resources/log4j2.xml 에 들어가서 위와 같은 코드가 존재하기에 출력이 되는 것입니다. log4j2 환경설정은 아래 사이트를 참고하시길 바랍니다. 참고 : https://www.egovframe.go.kr/wiki/doku.php?id=egovframework:rte3:fdl:logging:log4j_2:%EC%84%A4%EC%A0%95_%ED%8C%8C%EC%9D%BC%EC%9D%84_%EC%82%AC%EC%9A%A9%ED%95%98%EB%8A%94_%EB%B0%A9%EB%B2%95 ( FATAL > ERROR > WARN..
![]()
스프링MVC는 DispatcherServlet 등장으로 정말 엄청나게 web.xml의 역할이 축소되었습니다. 예전같으면 서블릿을 URL로 활용하기 위해선 반드시 web.xml에 등록해야 했지만 이젠 DispatcherServlet이 해당 어플리케이션으로 들어오는 요청을 모두 핸들링해주니 말이죠. 물론 아직까지 web.xml의 역할은 중요합니다. 으로 DispatcherServlet을 등록해줘야 하는데다 이 객체의 URL 적용범위 또한 web.xml에다 설정해야 하구요. 향후 고급서비스를 위해 나 를 등록하는 역할 또한 web.xml의 기능으로 남아 있습니다. 대신 앞으로 web.xml에서 가장 주요하고 자주 쓰이는 기능인 매핑은 이제 완벽하게 DispatcherServlet으로 넘어갔다고 생각합시다. 우..
스프링의 핵심 3대요소 Dependency InjectionDIInversion of Control IOCAspect Oriented ProgrammingAOP 1 의존관계를 느슨하게 하기 위해서 의존객체를 주입해 주는 것 2 필요한 핵심 객체를 다른곳에서(SpringFrameWork) 관리를 하는 것 3 aop를 배우는 목적은 뭔가 인증에 관련된 작업, 트렌젝션에 관련된 작업을 aop 로 처리가능로그인 필터를 쓰지 않고 aop로 필터링 처리를 할수도 있고트렌젝션 처리도 aop의 개념으로 처리 가능
![]()
home.jsp 에이렇게 코딩 인덱스에서 시작해보면home.do 요청에 대해서 이렇게 나오면 된것임 이 3개 파일 test.mybatis 패키지에 복사 이렇게 되게 Configuration 에이것만 남기고 MemberMapper 가서다지우고 이것만 남겨 MyBatis DB 에 관련된 설정을 servlet-context.xml 에서 할거야 servlet-context.xml 로가이거 코딩 classpath:test/mybatis/db.properties 문서를 읽어서 넣어주는것 SpringBeanContainer 에서 Dao 에 필요한 객체를 가지고 있다가 Dao 에 필요한 의존객체를 주입해 줄거야 의존객체를 주입해준다. → 이거를 dependency injection ( DI ) 라고 함 필요한 객체를 ..
Step11_include.html만들어클라이언트에게 출력 하는 시점에는 모든 컨텐츠가 다 완성되어 있어( header, footer 같은 것들이 )서버에서 완성된 채로 응답을 해클라이언트는 받은 거 그대로 쓰면돼 Angular 에선 이 조각 파일들을 서버에 요청을 해 ng-include 라는게 있어조각 파일이라는 의미에서 fragment 폴더 하나 만들어header, footer 만들어 문자열을 넣어야 하기에 싱글포테이션으로 감싸합치는 작업을 서버에서 하느냐일단 미완성된 형대로 응답을 한 다음에 이걸보고 anguler 가 요청을해서 끼워넣느냐 차이야요청이 총 4번 들어가 html 열고 자바스크립트headerfooter include 될 요청을 끼워 넣는거야 왜 이런짓을 하느냐?웹개발 할때 프론트 엔드 ..
Step10_jsonp.html만들어실행시키면 서버로 부터 특정 컨텐츠를 응답받은 웹브라우저야 서브라임에서이거 찾아봐 우클릭해서 오픈인 브라우저실행시켜보면 주소가 좀 달라서버 입장에서 저 두 주소를 완전 다르게 취급해 위에껀 서버입장에서 클라이언트가 맞아밑에껀 우리가 돌려놓은 서버와 아무런 연관이 없어 그냥 만들어놓은 하나의 html 페이지인것 위에껀 서버에 ajax 요청을 하면 응답을 하는데 밑에껀 응답을 안해 보안이슈 때문에 구분해서 응답해 밑에서 위로 요청을 하는 걸 cross domain 이라고해 크로스 도메인 요청을 서버에서 편법으로 제공을 해줘야 할때가 있어 서버에서 jsonp 방식으로 응답할 준비를 해놓으면 응답을 해 크로스도메인 요청이라풀 url 주소 써준 것 그리고 여기에 추가로 뭔가 넘..
angular 가 관리하고 있는어떤객체($scope)를 함수의 첫번째 인자로 넣어달라는 의미엄밀히 말하면 서비스라고 볼수 있어두번째 인자로 http 넣어 $http 는 Jquery 에서 ajax 처리 한거를Angular 에선 $http 를 이용해서 구현함 모듈과 컨트롤러 구현 얘를 눌렀을때 서버에 Ajax 전송을 할거야 $http 는 함수에 두번째 인자로 전달된 서비스야 전송이 성공했을때 실행되는 함수, 실패했을때 실행되는 함수를 등록을 하는거야이렇게 구성을해봐 이거를 처리할 httpTest.jsp 페이지 만들어 뭔가 ok가 나왔어 서버엔 null 이 들어가 있긴한데 jsp 페이지가 요청된것은 확인할수 있어 success 가 뜨는걸 봐서는 뭔가가 전송을 하고 있는거야 헤더정보 추가 여기 코드 바꿔주고 테..
![]()
123456789101112131415161718192021Step08_switch.html 하나 두울 세엣what : {{what}} Colored by Color Scriptercs 문서객체를 다 만들어 놓지 않고 문서객체를 만들거나 없애거나 하는 것임문서객체가 하나밖에 없어동적으로 만들거나 없애거나 하는 것임
![]()
event 1 123456789101112131415161718192021222324252627282930Step07_event.html .box{ width:100px; height:100px; background-color:yellow; }클릭!클릭!mouse 이벤트{{msg}}Colored by Color Scriptercs ng-clickng-focusng-keydownng-keyupng-blurng-mousedownng-mouseupng-mousemoveng-mouseenterng-mouseleave 버튼을 클릭하면 p 요소안에 msg 에 버튼 클릭이 출력 input 요소에 클릭하면 focus 적용 input 요소 클릭했다가 다른데 클릭해보면 blur 가 적용되는 것을 확인가능 마우스이벤트도 확..
![]()
애니메이션을 넣는 방법 https://daneden.github.io/animate.css/ 여기 들어가서 css 파일 다운 받은 다음에 css 폴더 안에 넣어준 다음에 angularJS 받은 파일에 가보면 angular-animate.js 파일이 존재 한다 이것도 가져와서 ngAnimate 모듈을 주입 해 주고 AngularJS 를 사용하겠다고 ng-app="myApp" 해주고 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748Step06_animate.html .fade-effect.ng-enter{ animation: fadeIn 1s; } .myImg.ng-enter{ animation: bo..
![]()
여기 입력하는 내용은 id 라는 이름의 모델로 지정을 하고반드시 입력을 해야 한다는 의미임 입력은 안하면 false뭔가 입력을 하면 true $valid 는 유효한지 여부 이걸 이용해서 뭔가 작업을 할수 있어 이렇게 코딩하면 뭔가를 입력하라고 알림을 줄수 있어 ( from 밑에 p 요소는 true / false 확인하려고 둔 것 ) 입력은 안하면 입력하라고 뜨고 뭔가 입력을 하면 사라짐 이렇게 ng-disabled 해주면 버튼이 비 활성화 가 됌 false 로 바꾸면 버튼이 동작함 false 인 상태로 가입을 누르면 뭔가 알림창이 뜨는데 이건 angular 가 해주는 것이 아니라 html5를 지원해주는 웹브라우저가 해주는 것임 이게 뜨면 혼돈이 오기 때문에 from 에 novalidate 해주면 저 알림..
![]()
step04_showHide 하나 만들어서 1234567891011121314151617Step04_showHide.html보이게 할지 여부 숨길지 여부 Colored by Color Scriptercs 이렇게 코딩해 주고 img 경로에 맞게 적당한 그림을 넣어 주면 isShow 가 false 이니 안보이고isHide 가 false 이니 보이는 것 isShow 가 true 이니 보이는 것이고isHide 가 true 이니 안보이는 것 isShow 가 true 이니 보이는 것이고isHide 가 false 이니 보이는 것.
![]()
Step03_class 만들어 bootstrap css와 js 파일들가져와서 옮겨놔 ng-class 라는 것이 있어 true 면 addclass, false 면 removeclass 가 되는 것임 지금은 true 니까 btn-primary 가 들어 간 것임 false 로 바꿔주면 primary 가 안들어 간 것을 확인 가능 이걸 isChecked로 바꿔 준다면?? checkbox 를 클릭함에 따라서 변경되게 할수 있음 특정 시점에서 addclass, removeclass 바꿔 줄수 있는 것임 Angular 에서 특정 클래스 조종을 하려면 ng-class 를 사용하는 것 ! Step03_class2 만들어 모듈 설정을 해주고 테이블에 컨트롤러 작성을 해줘 ajax 라고 받아온 데이터라고 가정한 것을 테이블..
![]()
Step02_controller2 만들고 input 요소에 뭔가를 적고 추가를 누르면 li에 추가가 되게 하고 싶어 msg 라는 모델을 만들고 빈 배열을 생성을 해 이렇게 해주면 페이지가 처음 생성되는 시점에 뿌려 질거야 이렇게 출력이 됌 ng-modle="msg" 해준것이 $scope.msg 라고 알려주는 것임 이렇게 하면 들어가긴 하는데 똑같은걸 여러번 넣으면 안들어감 그래서 object 로 바꿔 줄 것임 이렇게 object로 바꿔주면 여러번도 들어감 이제 모두 삭제하는 것을 해 볼거야 모두삭제 버튼을 누르면 빈 배열로 만들어 버리는 것임 입력창 초기화 하는 것도 추가 $scope.msg 는 컨트롤러 안에 모델을 가르킴 추가할걸 입력하고 추가 버튼을 누르면 input 창이 초기화 됌 모두 삭제를 누르..
![]()
Step02_controller 만들어 myApp과 Ctrl1 이라고 이름을 2개 지어 준것 이름지어준 것이니 마음대로 바꿔도 됨 이름지은 2개를 여기다가 각각 적어줘 하나의 모듈에 여러개의 컨트롤러를 둘수도 있고 각각의 컨트롤러를 따로 관리를 할 수가 있어 일단 하나를 만들어보고 하나 더 추가해 볼것임 scope는 Angular 에서 관리하는 변수임 이렇게 해서 출력을 해보면 이렇게 출력이 됌 ( 빨간색 코드는 Jquery 로 했을때의 예 ) name 라는 모델에다가 김구라를 넣은 것임 이렇게 컨트롤러를 하나 더 추가해 보면 이렇게 출력이 되는 것을 확인가능하다 myApp 이라는 모듈을 만들고 컨트롤러를 여러개 찍어낼수 있는 것이다. 이렇게 clicked 라는 함수를 만들어 주면 밑에서 clicked ..
![]()
Step01_click.html 만들어서 html 안에서 일어나는 일은 Angular 가 관리하겠다고 ng-app 을 붙여 준 것임 ng-click="msg='clicked'" 를 해주면 msg 라는 click 라는 문자열을 대입한다는 의미임 실행시켜서 보면 눌러보셈 버튼을 누르면 밑에 p요소에 clicked! 가 출력되는 것을 볼수 있음 이렇게 코딩 해주면 ng-init 는 count를 0으로 초기화 ng-click 는 클릭을 했을때 count 를 1씩 증가 시켜주는 것 실행 시켜보면 0으로 되어 있는 것을 볼수 있고 여러번 막 눌러보면 하나씩 증가 되는 것을 볼수 있다. jquery 라면 어떤 변수에다 넣고 그걸 참조를 해 str 이라는 변수에 hello 가 있는데 출력을 하고이후 시점에 str 이라..
![]()
AngularJS 설치 이클립스 환경을 JAVA EE 로 해두고 workspace 잡아줘 tomcat 서버 잡아주고 node.js와 port 충돌 날거니 port 바꿔주고 인코딩 설정 이거 4개 다 utf-8로 수정해줘 프로젝트 하나 만들어 두고 AngularJS 이제 받을것임 angularjs.org 들어가서 실무에서 아직은 옛날버전을 더 많이 쓰기에 옛날 버전인 밑에 걸 클릭 Branch : 1.2 x Buile : zip두개로 선택 해준다음 Download 눌러 이렇게 받아지면 압축 풀어보면 여러가지 자바스크립트 파일이 있어 js 폴더 하나 만들어서 이거 두개 붙여넣기 해줘 Hello.html 파일 하나 만들어서 이렇게 코딩해줘 웹 브라우저로 출력되게 이렇게 바꿔 준 후에 이렇게 출련되면 성공~ 1..
![]()
이 라이브러리를 받아서 사용을 해야해 Mvnrepository 에 들어가서 itext 를 검색해서 IText, A Free Java PDF Library 클릭해서 들어가 2.1.7 클릭 여기에 있는 소스코드 복사해 와서 붙여 넣기하면 라이브러리가 받아져 다 받아지기를 기다린 다음에 컨트롤러과 view 패키지 만들어 주고 servlet-context.xml 에 들어가서 component-scan 을 추가해줘 그래야 Bean 객체가 되는 것임 그리고 BeanNameViewResolver를 0으로 설정해 줘야 controller 에서 BeanName 을 먼저 찾아 위에서 만든 PdfController 에 DB에서 가져와야 하는데 일단은 Sample data를 넣어주고 BeanNameViewResolver를 설..
