본문 바로가기

Programming

 (135)
[Spring Boot] JPA + Pageable 을 이용한 페이징 처리 안녕하세요. 남산돈가스 입니다. 오늘은 Spring Boot JPA를 이용하여 API 개발 시 간단하게 Pagination 와 Sorting을 처리할 수 있도록 도와주는 Pageable에 대해서 알아보려고 합니다. 웹 개발 시 Pagination 과 Sorting은 필수적이라 할 수 있지만, 실제 개별적으로 구현 시 번거로운 작업이 생기기 마련입니다. 또한 각 데이터베이스마다 페이징 쿼리가 다를 수 있다는 점에서 모든 요구조건을 만족하기 어려운 부분들이 존재하기 마련입니다. Spring Data JPA와 Pageable을 이용하면 이런 문제들을 아주 쉽게 해결할 수 있어 비즈니스 로직에 집중할 수 있게 도와줍니다. 우선 Pageable을 사용하여 얻을 수 있는 이점은 대표적으로 두 가지 입니다. 요건에 ..
[Angular] 저장되지 않은 파일이 있는데 뒤로 가기를 누른 경우 경고 알럿 띄우기 안녕하세요. 명동섞어찌개 입니다. 오늘은 Angular 페이지에서 문서 (form) 작성 중 또는 무언가를 등록하다가, 저장하지 않고 브라우저 뒤로가기 버튼을 눌렀을 때 '저장하지 않은 파일이 있습니다. 페이지를 나가시겠습니까?'라고 묻는 알럿 띄우는 기능을 만들려고 합니다. 일반적으로 이런 기능은 javascript 에서는 popstate 이벤트 리스너를 사용해서 구현합니다. (모바일에서도 사용한 기억이 있습니다.) 1 2 3window.addEventListener('popstate', (event) => { console.log("location: " + document.location + ", state: " + JSON.stringify(event.state)); }); 하지만 Angular 에..
[Angular] File Upload > Drag and Drop 만들기 안녕하세요. 명동섞어찌개입니다. 오늘은 Angular 를 이용한 파일 업로드 기능 개발 시 편리한 사용성을 위해 Drag and Drop 드래그 앤 드랍 기능을 추가하는 방법을 알아볼건데요, vanila javascript (순수 자바스크립트) 로 개발하면 익스플로러와 크롬 브라우저 등 브라우저 별 예외처리가 필요해서 시간이 꽤 걸리는 일이지만 (개인적으로 0 부터 시작해서 개발했을 때 다른 업무 처리하면서 일주일 정도 걸렸습니다..) Angular 는 directive 를 사용해서 간편하게 개발할 수 있더라구요. Angular Version: 8 결과화면 1. 먼저 drag-and-drop directive 를 만듭니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 ..
[Angular] HttpInterceptor를 사용하여 Token 만료 검증하기 안녕하세요. 남산돈가스입니다. 이번 포스팅에서는 Angular 프로젝트 환경에서 API를 요청하실 경우, 가장 보편적으로 사용하시는 HttpClientModule에서 Http 요청을 가로채 특정 처리를 할 수 있도록 도와주는 HttpInterceptor 인터페이스에 대해서 작성해보겠습니다. 우선 HttpInterceptor는 Angular 4.3부터 추가 된 기능으로, 위에서 말한 것처럼, HttpClientModule을 이용한 API 호출 시 그 중간의 요청을 가로채어 특정 처리를 진행할 경우에 사용합니다. 저희 팀에서 Angular를 진행하는 프로젝트에서는 이 Interceptor를 API 호출 시 OAuth Token을 만료인지 유효한 지 검증하기 위한 용도로 사용되고 있습니다. 이번 포스팅에서 예..
Git 명령어 정리 안녕하세요. 남산돈가스입니다. 오늘은 개발하면서 자주 사용하는 Git 명령어에 대해서 정리해보는 시간을 가지려고 합니다. 이실직고 하자면, 매번 IDE에서 제공하는 UI환경으로만 Git을 이용하다 보니까 까먹는 경우가 생기게 되어 다시 한번 되짚어보자라는 생각에 포스팅을 적어봅니다...ㅎ git init 명령어를 실행한 디렉토리에 새로운 Git 저장소를 생성하게 됩며, .git 디렉토리가 만들어집니다. README.md 파일을 생성합니다. git status 명령어를 실행하면 현재 디렉토리의 git 상태를 확인할 수 있습니다. git add Untracked(git이 추적하지 않고있는) file을 git이 관리하는 파일로 추가하게 됩니다. git rm --cached tracked 된 file을 다시 u..
[iOS 강좌] 오픈API 이용한 날씨 APP 만들기 - 5. 도시 정보 변경 제공하는 날씨 API에서 도시 정보를 획득하려면, 별도로 citi 정보를 받기 위해 API를 호출해야합니다. 아래의 json파일을 아마존 s3 저장소에 저장하고, 호출을 하였습니다. https://s3.ap-northeast-2.amazonaws.com/com.ios/city.list.json Citi정보에 대한 모델 객체를 생성하고, #import #import "Coord.h"@interface City : NSObject @property (nonatomic,strong) id id;@property (nonatomic,strong) Coord *coord;@property (nonatomic,strong) NSString *country;@property (nonatomic,strong) NSSt..
[iOS 강좌] 오픈API 이용한 날씨 APP 만들기 - 6. 모델 객체 날씨 API 호출된 모델 객체를 생성합니다. { "dt": 1532314800, "main": { "temp": 308.77, "temp_min": 305.287, "temp_max": 308.77, "pressure": 1002.18, "sea_level": 1023.05, "grnd_level": 1002.18, "humidity": 67, "temp_kf": 3.48 }, "weather": [ { "id": 801, "main": "Clouds", "description": "few clouds", "icon": "02d" } ], "clouds": { "all": 20 }, "wind": { "speed": 1.47, "deg": 229.003 }, "sys": { "pod": "d" }, "d..
[iOS 강좌] 오픈API 이용한 날씨 APP 만들기 - 7. CoreLocation 내위치를 기반으로 날씨 정보를 가져올수 있습니다. // 코어 로케이션#import // 변수 @property (nonatomic, strong) CLLocationManager *locationManager;// Location Manager 생성self.locationManager = [[CLLocationManager alloc] init]; // Location Receiver 콜백에 대한 delegate 설정self.locationManager.delegate = self;// 델리게이트// longitude, latitude 값 가져옴-(void)locationManager:(CLLocationManager *)manager didUpdateLocations:(NSArray *)location..

티스토리툴바