[프론트엔드]_(75)
-
[IntelliJ]_jQuery 라이브러리 추가, 적용
개발환경을 만들면서 jQuery가 필요해서 IntelliJ 에 가져와 보았습니다. jQuery 를 사용하는 이유 - 크로스 브라우징: 한번의 코딩으로 모든 브라우저에 적용 - 다양한 플러그인: jquery 기반 플러그인들이 무료로 배포 - 브라우저 호환성 - Ajax 통신처리 용이 우선 다운로드를 받기 위해 공식 사이트에 들어간다. https://jquery.com/download/ Download jQuery | jQuery link Downloading jQuery Compressed and uncompressed copies of jQuery files are available. The uncompressed file is best used during development or debugging;..
2021.12.03 -
[TypeScript]_IntelliJ Spring_lib.dom.ts 외부 라이브러리 가져오기
TypeScript 에 있는 함수를 사용하기 위해서 외부 라이브러리를 IntelliJ 에 추가해야한다. 준비물 1. IntelliJ 에서 Ts Plupin install (미설치 시) 2. 사용할 외부 라이브러리의 jar 파일 저는 dom4j-1.6.1.jar 를 준비하였습니다. 우선 IntelliJ 에서 file->project structure클릭 모듈을 선택하고 왼쪽의 + 클릭 후 JARs or Directories 클릭 추가할 Jar 파일 클릭 잘 들어온 것을 확인 후 ok 버튼 클릭 그럼 아래의 그림처럼 External Livraires에 잘 들어온것을 확인 가능 이제 jar 안에 있는 함수를 쓰려면 lib.dom.ts 에서 Document로 부릅니다. 다음과 같이 .로 참조한 뒤 원하는 함수를..
2021.12.02 -
[IntelliJ]_Spring 로딩 페이지 설정
1. 저번에는 개발 환경을 만들어 보았다 이번에는 추후 로그인 페이지를 대비하여 빌드 후 원하는 jsp 파일을 호출하도록 해봤다. 그전에 알아둬야할 것 - Controller Spring 에서 controller의 시작점은 서버가 실행 될 때 전부 메모리에 올라간 뒤에 서버가 시작된다. controller의 특징 다양한 타입의 파라미터 처리, 다양한 타입의 리턴 타입을 사용 가능하다. 대규모 프로젝트로 갈 수록 서비스가 많아지는데 이걸 하나의 클래스에서 처리하는 것이 아니라 controller 라는 중간 제어자 역활을 하는 것을 만들어서 각각 호출하게 만들 수 있다. MVC 패턴에 포함된다. 이는 유지보수가 용이하다. 우선 homeController 안에 다음과 같은 코드를 작성한다. @Controlle..
2021.12.01 -
[IntelliJ]_빠른 테스트
IntelliJ ctrl + s 후 페이지에서 f5로 갱신하는 방법 여기에서 On Update atrion 과 On frame deactivation을 해당 항목으로 선택후 apply 하면된다.
2021.12.01 -
[IntelliJ]_Spring 개발환경 설정 (feat.Tomcat)
이전에 두었던 Tomcat 으로만 구현된 웹서버 개발환경에는 큰 문제가 있었다. 이렇게 두고 톰켓을 이용한 서버는. 단순한 구조일 뿐 더러. 지금 직장에서 사용하는 환경과는 동 떨어져 있기 때문이다. 그래서 분석해본 결과. spring을 뼈대로 나누고 MVC처럼 동작하는것 처럼 만들었다. 그래서 spring 연동을 해볼 예정이다. 1. 프로젝트 만들기 new- > project 에 들어간 다음. 이름과 location 지정 후 순서대로 java : 자바기반 언어로 만들것이기 때문에 선택 Maven : 프로젝트 타입 group : 프로젝트 저장소와 관련된 Artifact 그룹 artifact 사용하는 maven project에서 빌드 결과물로 나오는 개체를 artifact라고 한다. 프로젝트 -> 빌드 -..
2021.11.30 -
[_IntelliJ ]_ 코드 작성 시간을 줄여주는 단축키
개발환경에서 IntelliJ 를 쓰면서 자주 사용하는 단축키를 정리. 코드 편집에 유용한 단축키 Ctrl + / : 선택한 라인 주석 처리 Ctrl + Shift + / : 선택한 영역만큼 주석 처리 Ctrl + Y : 커서가 위치한 라인 삭제 Ctrl + D : 현재 코드 복사하여 바로 밑에줄에 붙여넣기 Alt + Enter : import Ctrl + W : 커서 근처의 코드 선택 영역 확장 Ctrl + Shift + W : 커서 근처의 코드 선택 영역 축소 Ctrl + P : 커서가 위치한 메서드의 매개변수 조회 Alt + Insert : 생성자, Getter/Setter, toString과 같은 코드 생성 Ctrl + E : 최근 연 파일 목록 검색 Shift + F6 : Rename Shift ..
2021.11.30 -
[초보개발자]_JSP 메모장 3번
※단순 공부용 메모이며, 내용은 틀릴 수 있습니다. 1. 개발환경 탐색 지금 사용하고 있는 환경은 tomcat과 spring 조금 jsp로 이루어져 있다. jsp란? java 언어를 기반으로 하는 ServerSIde 스크립트 언어이다. html 과 java 코드가 공존함으로써 정적인 html을 http통신(동적)을 혼합하여 사용할 수 있게 한다. JSP가 실행되면 was(tomcat) 은 내부적으로 java로 변환한다. 변환된 servlet을 이용하여 기능을 수행한다. tomcat이 만들어놓은 객체를 사용한다. 벡엔드부터 처음까지 하게 되면 Http 통신부터 공부해야한다. 이를 쉽게 도와주는 것이 spring Framework 이다. 2. 우선 tomcat을 실행하면 최상단 root부터 시작하게 되고 /..
2021.11.29 -
[IntelliJ ]_설치와 Tomcat 서버 연동
1. IntelliJ 공식 홈페이지에서 다운로드를 받는다. https://www.jetbrains.com/ko-kr/idea/download/#section=windows 다운로드 IntelliJ IDEA: 우수성과 인체 공학이 담긴 JetBrains Java IDE www.jetbrains.com 2. 한국어가 좋다면 한국어 패치를한다. https://plugins.jetbrains.com/plugin/13711-korean-language-pack------/versions Korean Language Pack / 한국어 언어 팩 - IntelliJ IDEs Plugin | Marketplace The Korean Language Pack localizes the UI of IntelliJ IDEA,..
2021.11.27 -
[프론트엔드]_JavaScript(es6)_5. Object
공부 자료 : 드림코딩 by 엘리 개발 환경 : visual studio code 언어 : js 1.Object 오브젝트란 저번에 말한 것처럼 틀이 정해져 있다면 그안에 값을 지정해서 메모리에 올라가 동작하는 것을 말한다. {} 안에 직접 지정하는 object literal 문법이 있고 생성자를 이용해서 만드는 object constructor 문법이 있다. 이처럼 yoon 이라는 object를 {}를 사용하여 생성하고 이를 Function 의 파라미터로 전달 할 수 있다. 자바스크립트는 동적으로 (Runtime) 동작하는 언어인데. 뒤늦게 하나의 property를 추가 할 수 있다. 이렇게 생성하고 지울 수 있지만 필드에서 유지보수를 할 때 힘들고 오류발생을 야기한다. 이 개념에서 가장 중요한 것은 O..
2021.11.27 -
[프론트엔드]_JavaScript(es6)_4. Class
공부 자료 : 드림코딩 by 엘리 개발 환경 : visual studio code 언어 : js 클래스란 무엇인가? 클래스는 모양이 정해진 틀과 같다. 붕어빵 틀 혹은 청사진이라고도 부를 수 있다. 데이터가 들어가 있지 않고 한번만 선언된다. 메모리에 올라가지 않는다. 오브젝트란? 클래스에서 틀을 만들었다면 값 (붕어빵에서는 팥붕어빵, 슈크림 붕어빵) 과 같이 테이타를 넣어서 instance를 생성했을 때 Object가 된다. 데이터가 들어가 있고, 여러번 선언될 수 있다. 또한 메모리에 올라가게 된다. JS에서는 es6 전까지는 class 라는게 정의되어 있지 않고 object로 만들었었다. 클래스는 prototype-based 로 만들어진 것이며 의미는 같다. 1. 기본 형식 위에서 Person 이라..
2021.11.27 -
[초보개발자]_JSP 메모장 2번
1. Intellij 와 SVN 1단계 intellij와 VSN 둘다 처음 쓰다보니 햇갈려서 적어봅니다. GIT과 유사하게 update 선 commit을 해야하고 해당 파일 혹은 directory 에서 마우스 우클릭 -> subversion 항목으로 들어간다. history 항목으로 들어가서 어느 값이 변경되었는지 확인할 수 있다. 이는 충돌이 났을때 (파일이 빨간색) 일때 사용하면 된다. 파일 색으로 추측이 가능하다. 대표적으로 파란색은 서버에 올라가있는 파일과 차이점이 있을때 나타나고 빨간색은 merge 충돌이 났거나 오류가 발생했을 때 회색은 삭제할 예정일 때 발생한다. 자세한 색은 다음과 같다 : https://www.jetbrains.com/help/idea/file-status-highligh..
2021.11.26 -
[초보개발자]_JSP 메모장 1번
1. Form태그 -> bootstrap 에서 제공하는 형태이다. 즉 action이 달려있는 의미 그중 submit은 페이지 이동이 강제로 일어난다. SPA 에서는 필요가 없기 때문에 버튼으로 수정하고 Form 태그를 지워줘야 Enter 입력시 tab이 닫히는 현상을 막을 수 있다. form은 전달 형식중 한가지이며 post와 get 방식이 나눠져있다. 2. 함수 선언은 굳이 한번 쓴다면 밖에 할 필요는 없다. -> 이는 메모리 참조로 이어진다. 또한 변수 선언을 let으로 해줘야한다 let으로 선언하지 않을때는 var로 선언되는데 이는 hoisting되어 다른 오류를 발생시킬 수 있다. 3. 그리드 페이지 검색기능 개발 onchange 와 onkeyup을 이용하여 구현 onchange는 안의 값이 변경..
2021.11.25