[TIL] 3월 24일

yeon·2021년 3월 24일
1

이코테 이진탐색 파트 (186p)

이진탐색

이진탐색 코드는 암기하고 있는게 좋다. 이진탐색 소스코드를 구현하기란 어렵다.

데이터의 개수나 값이 1,000만 단위 이상이면 이진탐색과 같이 O(longN)의 속도를 내는 알고리즘으로 문제를 풀어야한다.

파라메트릭 서치(Parametric Search)

: 최적화 문제를 결정문제(예 혹은 아니오)로 바꾸어 해결하는 기법 → 이진탐색을 이용해서 해결할 수 있다.

  • 이진탐색 구현 코드 (재귀함수)

    public class BinarySearchRecursive {
    
        public static int binarySearch(int[] arr, int target, int start, int end) {
            if (start > end) return -1;
            int mid = (start + end) / 2;
            if (arr[mid] == target) {
                return mid;
            } else if (arr[mid] > target) {
                return binarySearch(arr, target, start, mid - 1);
            } else {
                return binarySearch(arr, target, mid + 1, end);
            }
        }
    
        public static void main(String[] args) {
            Scanner sc = new Scanner(System.in);
    
            int n = sc.nextInt();
            int target = sc.nextInt();
    
            int[] arr = new int[n];
            for (int i = 0; i < n; i++) {
                arr[i] = sc.nextInt();
            }
    
            int result = binarySearch(arr, target, 0, n - 1);
            if (result == -1) {
                System.out.println("원소가 존재하지 않습니다.");
            } else {
                System.out.println(result + 1);
            }
        }
    }
  • 반복문

    public static int binarySearch(int[] arr, int target, int start, int end) {
    		while (start <= end) {
            int mid = (start + end) / 2;
            if (arr[mid] == target) {
                return mid;
            } else if (arr[mid] > target) {
                end = mid - 1;
            } else {
                start = mid + 1;
            }
        }
        return -1;
    }

실전문제

부품찾기

197p

내풀이

public class FindComponents {

    public static void main(String[] args) {
        Scanner sc = new Scanner(System.in);
        int n = sc.nextInt();
        int[] components = new int[n];
        sc.nextLine();
        for (int i = 0; i < n; i++) {
            components[i] = sc.nextInt();
        }
        sc.nextLine();
        int m = sc.nextInt();
        int[] askedComp = new int[m];
        sc.nextLine();
        for (int i = 0; i < m; i++) {
            askedComp[i] = sc.nextInt();
        }

        String[] results = new String[m];

        // 정렬
        Arrays.sort(components);

        // 이진탐색
        for (int i = 0; i < m; i++) {
            if (search(components, askedComp[i], 0, n - 1) >= 0) {
                results[i] = "yes";
            } else results[i] = "no";
        }

        for (String result : results) {
            System.out.print(result + " ");
        }
    }

    public static int search(int[] comp, int target, int start, int end) {
        if (start > end) return -1;

        int mid = (start + end) / 2;

        if (target == comp[mid]) {
            return mid;
        } else if (target < comp[mid]) {
            return search(comp, target, start, mid - 1);
        } else {
            return search(comp, target, mid + 1, end);
        }
    }
}

미션5 진행

질문 목록에 답변 수 보여주기 기능 추가

6-4. 질문 목록에 답변 수 보여주기 기능 추가

각 글마다 count query를 날려서 댓글의 개수를 얻는다면 글이 많을수록 쿼리를 많이 날려서 성능이 저하된다.

성능 개선을 위해, 답변을 작성하거나 삭제하는 순간에, 댓글의 개수를 변경해서 질문 테이블에 담는다.

Question에 countOfAnswer 필드를 추가해주고, @JsonProperty를 달아주고, index.html에 이 필드를 넣어서 질문목록에서 답변 수를 보여주도록 한다.

댓글을 달면 콘솔에 Uncaught TypeError: Cannot read property 'id' of undefined 에러가 뜬다.

아래 블로그 참고

누구나 한 번쯤은 띄워본 JavaScript 에러 TOP 10.

var template = answerTemplate.format(data.writer.userId, data.formattedPostTime, data.contents, data.question.id, data.id);

scripts.js 파일의 이부분에서 에러가 나는듯 하다. data.id를 못읽어 온다는건가. 블로그의 글을 빌리면, 가장 일반적인 이유는 UI component를 렌더링하는 동안 상태 초기화가 되지 않아서 발생한다고 한다.

댓글을 달고 새로고침을 하면 잘 달리긴한다. 이 값을 초기화해줘야하나. 문제되는 코드 위에 data.id = 1;이라고 했는데도 해결이 안된다. 자바스크립트를 잘몰라서 해결하기 어렵다.

Swagger 라이브러리를 통한 API 문서화 및 테스트

6-6. Swagger 라이브러리를 통한 API 문서화 및 테스트

답변하기와 같이 post방식으로 데이터 전송하고, json기반으로 서비스하고 있는 api를 클라이언트 개발자가 볼수 있어야한다.

따라서, api 서버를 만들고, json API에 대한 테스트를 하고 문서화하는 작업이 필요하다.

→ Swagger 라이브러리를 사용하면 이 작업을 자동화할수 있다.

build.gradle에 dependencies 추가하기

Gradle 환경에서 Spring Boot 에 Swagger 2 적용하기


구현에 사용된 어노테이션과 자바스크립트 코드

@Controller와 @RestController 차이

참고한 블로그

이 둘의 주요 차이점은 HTTP Response Body가 생성되는 방식이다.

  1. @Controller (Controller-View)
    • 주로 View를 반환할때 사용
    • 컨트롤러가 뷰를 반환하기 위해서는 viewResolver가 사용된다. viewResolver가 설정에 맞게 view를 찾아서 렌더링한다.
  2. @ResponseBody (Controller-Data)
    • Spring MVC 컨트롤러에서도 Data를 반환해야하는 경우가 있는데 이때 @ResponseBody 어노테이션을 붙인다. 해당 어노테이션을 붙으면 컨트롤러도 Json 형태로 데이터를 반환할 수 있다.
  3. @RestController (Spring RESTful Controller)
    • Spring MVC 컨트롤러에 @ResponseBody가 추가된 것
    • JSON 형태로 객체데이터를 반환하는 것이 주용도

e.preventDefault()

이벤트를 취소할 수 있는 경우 ,이벤트 전파를 막지 않고, 그 이벤트를 취소한다.

qna 프로젝트에서 어떻게 쓰이는건지..?

serialize()

[jQuery] serialize()

form을 대상으로 serialize()메소드를 사용하면 form의 객체들을 한번에 받을 수 있다.

ajax에 data값을 세팅할때 사용하면, 해당 form의 값을 쉽게 받을 수 있다.

var queryString = $(".answer-write").serialize();

→ answer-write 라는 class가 있는 form 태그를 통해 입력된 값들을 얻는다는 뜻인가...?

attr()

요소의 속성값을 가져오거나 속성을 추가한다.

var url = $(".answer-write").attr("action");

→ answer-write 라는 class에 해당되는 form태그의 action 속성의 값을 var url에 담는다.


오늘한일

  • 미션5 하고 있는데 스프링 처음 접했을때 느낌이다... 자바 스크립트 코드를 그냥 따라치고 있는중 ㅠㅠ 여러번 보고 따라야해야될거 같다.
  • @RestController란?
  • 수요일은 알고리즘 푸는날, 이코테에 이진탐색 부분 학습하고 한문제 풀었다.
  • 깃헙에서 칸반타입 프로젝트 만들고, 기능마다 이슈를 생성해서 구현해야할 기능을 정리했다. 해결해야할 버그나 리팩토링할 부분, 학습할 부분에 대해서도 이슈 생성하고 label을 추가해서 달아줬다. 스크럼 시간에 milestone이라는것도 알게 되었는데 이슈보다 큰 단위로 생성해서 이슈를 그 안에 담는방식으로 사용해봤다. 이렇게 미션을 진행하니 진행한 부분을 시각적으로 명확하게 볼수 있고 이슈를 close해서 Done으로 옮겨진걸 보면 약간 뿌듯하다. 앞으로 프로젝트 할때마다 이렇게 해야지. 지금은 구현해야할 기능들이 루카스에 다 나와있어서 이 작업도 쉽게 되는데 혼자 설계까지 해야할때는 쉽지 않을거같다.
  • 디비 공부해야하는데 엉엉 자기전에 SQL 첫걸음 온거 읽어야겠다.

Todo

(내일)

  • scripts.js에서 onSuccess 와 deleteAnswer에 사용된 자바스크립트 코드 검색해보기
  • AbstractEntity를 구현하면서 사용된 어노테이션들에 대해 학습하기 (@MappedSuperClass, @CreatedDate, @LastModifiedDate, @EnableJpaAuditing, @EntityListeners(AuditingEntityListener.class) )
  • sql 첫걸음

4개의 댓글

comment-user-thumbnail
2021년 3월 24일

열심히 하시는 모습이 보기 좋네요! 화이팅! 👍

1개의 답글