본문 바로가기

전체 글111

[Java] JSP + Spring 게시판 만들기 JSP와 Spring을 활용해서 게시판 만들어보기. 1. 메인 페이지 페이지 내 기능: 게시물 목록으로 이동 게시물 작성으로 이동 해결 과정: a 태그를 감싼 button을 활용하여 이동 2. 게시물 목록 페이지 페이지 내 기능: 게시물 목록 출력 기능 리스트에 title 클릭 시 조회, 수정, 삭제 페이지로 이동 기능 해결 과정: DB 연동: Postgresql + Mybatis + Spring을 이용 (pom.xml 설정, application.yml 또는 application.properties 설정) DAO와 DTO 객체를 이용해서 DB에 접근 ModelAndView 객체를 이용해서 뷰와 모델을 전달, 출력 DB.board 테이블에 저장된 데이터 중 Title, Name, Date 를 목록 형식으.. 2023. 2. 28.
[Javascript] ES6 컬렉션 프로그래밍 언어에서 Collection이란? 프로그래밍 언어가 제공하는 값을 담을 수 있는 컨테이너 Java에서 ArrayList, HashMap, HashSet, Queue, Stack 등이 존재한느 것처럼 Javascript에도 컬렉션들이 존재한다. ES5 에선 Object와 Array만이 존재 하였지만 ES6 부터 Arrays, Typed Array / Object, Map, Set, Weak Map, Weak Set이 존재한다. 특정 상황에서 ES6의 컬렉션들을 사용할 시 기존의 컬렉션들을 사용하는 것 보다 최적화된 구현체를 제공한다. - Set Value를 키 값으로 갖는 컬렉션으로 수정 가능하며, 프로그램이 실행되는 동안 값의 추가나 삭제가 가능하다. Set과 Array는 비슷하지만 차이점이 .. 2023. 2. 13.
[Javascript] ES6 문법 정리 (대표 9가지) + Babel 기존에 jQuery를 활용한 ES5 문법에서 최신 트렌드에 맞게 ES6 문법을 공부해보도록 하자. - ES6란? ECMAScript 2015로도 알려진 ES6는 ECMAScript 표준의 가장 최신 버전이다. ES6는 새로운 언어 기능이 포함된 주요 업데이트이다. + 2015년은 ES5(2009)이래로 진행한 첫 메이저 업데이트가 승인된 해 최신 Front-End Framwork인 React, Angular, Vue에서 권고하는 언어 형식 ES5에 비해 문법이 간결해서 익숙해지면 코딩을 훨씬 편하게 할 수 있음 - ES6의 대표적인 문법 const and let Arrow Function Template Literals Default parameters Array and object destructing.. 2023. 2. 13.
[Web] 실습 UI 개발로 배워보는 순수 javascript와 VueJS개발 - Vue.js란? Vue.js는 웹프론트엔드 프레임워크 중 하나이다. 컴포넌트 기반의 SPA(Single Page Applcation)를 구축할 수 있게 해주는 프레임워크이다. 컴포넌트란 웹을 구성하는 로고, 메뉴바, 버튼 등 웹 페이지 내의 다양한 UI요소를 재사용 가능하도록 구조화 한 것이다. SPA는 단일 페이지 어플리케이션으로 하나의 페이지 안에서 필요한 영역 부분만 로딩 되는 형태를 말한다. 빠른 페이지 변환과 적은 트래핑 양을 지원한다. Vue.js를 공부하기 위해서 인프런의 "실습 UI 개발로 배워보는 순수 javascript와 VueJS개발" 강의를 따라하며 학습해보겠다. - 개발환경 node.js vscode chrome(최신 버전) lite-server(개발 서버) git(코드 형상 .. 2023. 2. 10.

티스토리툴바