모르는게 많은 개발자

저번 포스팅인 함수형 인터페이스, 람다 표현식 개념/예제에 이어서 Stream, Optional을 정리해보려 한다. 1. Stream 자바8 이전에서는 List에 담긴 데이터를 처리하려면 foreach, for를 이용해 순회하며 데이터를 처리했다. 하지만 이렇게 작성된 코드는 길이도 길고 가독성이 떨어졌다. 이러한 문제점을 해결하기 위해 stream기능이 추가됐다. Stream은 Array, Collections와 같이 연속된 형태의 객체다. 그리고 2개의 연산 과정을 거쳐 데이터를 가공할 수 있다. 생성 연산 : Stream객체 생성 중개 연산 (filter, map) : List에 들어있는 데이터를 조건에 맞게 가공(ex: 특정 String만 골라내기)하는 연산들을 의미 Stream을 반환 즉, 중개..

최근 자바8을 제대로 모르는 것 같아 공부를 하면서 함수형 인터페이스와 람다 표현식을 정리하기 위해 이 글을 쓴다. 1. 함수형 인터페이스 람다식을 알기전에 함수형 인터페이스가 무엇인지 알아야할 것 같다. 함수형 인터페이스란 한개의 추상 메소드가 선언된 인터페이스를 의미한다. @FunctionalInterface public interface RunSomething { void doIt(); } 위의 코드를 보면 @FunctionalInterface Annotation이 선언되어 있는데 이것은 해당 인터페이스가 함수형 인터페이스라는 것을 알려준다. 만약, @FunctionalInterface가 선언된 인터페이스에 추상 메소드가 1개가 아닐 경우 컴파일 에러가 발생한다. @FunctionalInterfac..

Vue 프로젝트를 하다보면 vuex라는 것을 당연히 사용하게 되는데 vuex가 무엇인지 정리하고자 이 글을 쓴다. 1. Vuex vue를 사용하면 부모 컴포넌트의 데이터를 자식 컴포넌트로 보내야할 일이 많다. 그럼 일반적인 방법으로는 props 기능을 이용해 아래처럼 데이터를 보내게 된다. {{test1}} 그렇다면 만약 아래처럼 또 부모의 자식의 자식 컴포넌트로 보내려면 또 props를 이용해서 보내줘야 한다. {{test1}} 결과적으로 이러한 과정을 거치고 프로젝트가 커진다면 코드가 복잡해지고 유지보수가 어렵게 만들 수 있다. 그래서 존재하는 것이 Vuex이다. Vuex는 모든 컴포넌트가 공유할 수 있는 싱글톤 방식의 데이터 저장소이다. 즉, 단일 객체에 변수를 선언하고 모든 컴포넌트에서 사용할 수..

이번 글에서 mac에 nginx에 Vue 프로젝트를 올리는 내용을 간단하게 써보려 한다. 1. Vue 프로젝트 만들기 및 Build vue 프로젝트를 만들어주자 터미널에서 Vue 프로젝트 만들폴더를 하나 만들고 이동해준다. vue-cli vue-cli가 설치되어있지 않다면 아래 명령어로 vue-cli를 설치해준다. $ npm install -g vue-cli vue init 이제 vue project를 만들자 아래 명령어를 입력해 프로젝트에 대한 설정을 하고 프로젝트를 생성한다. $ vue init webpack-simple 완료 한후 npm install을 통해 의존성을 설치해준다. $ npm install 그 후 프로젝트 구조를 보면 다음처럼 구성되있을 것이다. 다음으로 이제 nginx에 올릴 배포 ..

최근 Vue를 공부하면서 Javascript공부의 필요성을 느꼈고 차근차근 공부하다 Prototype에 대해 정리하기 해보려한다. 자바스크립트는 프로토타입 기반 언어라는 것을 많이 접했다. 그럼 프로토타입이란 무엇일까 프로토타입을 알기전에 자바스크립트의 함수와 객체의 내부구조를 먼저 알아보자 1. 함수, 객체의 내부 구조 function Person(){} var joon = new Person(); var jisoo = new Person(); 위의 코드는 간단하게 함수를 정의하고 new 연산자를 통해 함수의 객체를 생성한 코드이다. 저 코드에서는 현재 두가지의 행동이있다. 첫번째는 함수 정의, 두번째는 new를 통한 객체 생성 함수 정의 자바스크립에서는 함수를 정의하면 함수의 멤버로 prototype..

토이 프로젝트를 진행하며 페이징 작업을 해야하는데 PageHelper + thymeleaf + Mybatis로 진행한 정보가 부족한것 같아 직접 포스팅하고자 글을 쓴다. 이 글에는 검색기능까지 포함된 리스트 페이징을 다뤄본다. 1. PageHelper 의존성 추가, application.yml 설정 일반적으로 페이징을 구현한다하면 여러가지 다소 귀찮은 작업들이 들어간다.(DB 데이터 개수, 현재 페이지, 이전 페이지, 다음 페이지 등등) PageHelper는 이러한 귀찮은 작업들을 다 구현해놓은 Github에 올라와있는 오픈소스다 github.com/pagehelper/Mybatis-PageHelper pagehelper/Mybatis-PageHelper Mybatis通用分页插件. Contribute t..

최근 인턴을 통해 PHP Laravel을 이용해 개인 프로젝트를 진행했고, 이것을 Spring Boot로 Migration하는 작업을 진행하고 있다. 그리고 회원 기능이 필요하여 Spring Security를 공부하여 간단하게 회원기능을 구현했다. 이번 글에서 spring security 간단 구현을 통해 어떠한 방식으로 구현되는지 정리해보려 한다. spring-security에 대한 자세한 개념은 추후 더 공부하여 정리하려한다. 이번 글에서는 구현자체에 포커스를 맞춘다. 1. 완성 상태 먼저 예제 결과부터 보자 위처럼 간단한 회원가입을 진행할 수 있는 페이지가 있다. 로그인 페이지는 spring security에서 제공하는 로그인 페이지를 사용한다. 회원가입한 아이디로 로그인시 유저 권한을 얻은 사람만..

최근 프로젝트에서 프론트엔드 Jquery, Ajax를 적극 활용해보며 프론트에 약간 관심이 생겨 Vue를 한번 공부해봤다. Vue에 대한 개념은 건너뛰고 문법만 딱 정리하고자 한다. 1. Vue 인스턴스 Vue.js로 프론트엔드를 개발할때는 Vue 인스턴스를 만드는 것부터 시작한다. Vue 인스턴스에서 제공되는 옵션을 붙여 개발을 할 수 있다. new Vue({ el: "#app", data: { text: 'hello world' }, }) 기본적으로 위의 코드처럼 new Vue를 통해 인스턴스를 생성하고 안에 el, data등 옵션을 넣어 인스턴스를 생성하고 화면을 컨트롤 할 수 있다. 2. 데이터 표시 {{데이터}} ... {{ myText }} v-text 위와 같이 프로퍼티를 html에 표현할 ..