본문 바로가기

항해99

항해 준비 D - 14 파이썬 코드를 자바로 바꿔보았어요!

목차

  1. Python to Java 

0. 웹 개발 종합반 1 - 5주 완강 후기

웹 개발 종합반은 항해에서는 제공해주는 사전 강의로 '웹 개발이란 이런 것이다.' 이 정도를 알려주는 느낌이다.

 

과정중에는 AWS로 EC2로 원격 서버를 여는다. 독학할 때 과금 폭탄 먹었던 기억이 떠올라 적잖은 PTSD를 느낄 수 있었다. 그래도 혼자 공부할 때는 EC2가 뭔지도 몰랐고 리눅스? 이런건 뭐야... 서버를 어떻게 접속하는지도 몰랐다.

 

물론 지금도 모른다. 강사님이 주신 코드를 따라 친 것이니까

 

그래도 웹 개발의 대략적인 흐름을 알 수 있어 좋았다.

 


1. Python to Java

강의를 다 듣고 Python 언어로 구현된 백엔드 부분을 Java로 바꿔보았다. 생각보다 어려웠다 ㅎ

잘못된 내용이 많을 수 있어요!

 

1. view 페이지가 반환이 안되요

@GetMapping()
public String homeV1() {
    return "home";
}

 

home.html 을 찾지를 못하는거다. ㅠ 골머리 앓았다. 예전에 진행한 프로젝트에서는 잘 되는데 왜 안되지 했다.

 

문제는 경로 인식, 다시 공부해야할 부분이다.

 

gralde 파일에 타임리프를 추가하여 templates 하위 폴더를 기본으로 인식하게 해서 문제를 해결했다. 

implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'

 

 

2.@ResponseBody , @RequestBody 몰라요 ajax도 몰라요!

 

하하 해당 어노테이션에 대해 내가 아는건

JSON 형식으로 데이터를 주고 받을 때 활용한다는 것 밖에 모른다!

더 공부해야할 부분이다.

 

@ResponseBody
@GetMapping("/show")
public ArrayList<Letter> home() {
    ArrayList<Letter> fans = homeRepository.find();
    return fans;
}

 

$.ajax({
        type: "GET",
        contentType : "application/json",
        url: "/home/show",
        data: {},
        success: function (response)

위 코드는 ajax 에서 컨트롤러단에 데이터를 요청하는 것이다.

발생했던 문제는 2가지

1. ajax - url

url이 의미하는 바를 몰랐다. 요청을 보낼 url을 말한다.

 

2. ajx -  contentType

해당 값을 입력안하면 "application/x-www-form-urlencoded" 으로 요청한다.

응답하는 컨트롤러 단에서 자바 객체 형태로 보내서 오류가 나는 것 같았다. 그래서 json으로 바꿔주었다.

 

3. ResponseBody, RequestBody 

이전에 혼자 프로젝트를 진행할때는 스크립트없이 타임리프만 이용해서 딱히 두 어노테이션을 사용할 일이 없었다.

프론트와 협업을 하면 두 어노테이션을 사용할 일이 많을 것 같다. 따로 정리해두겠다.

 

3. 객체에 대한 감각이 없었다.

 

Java로 변환하면서 가장 오랜 시간 머리를 싸맷던 곳이 이 부분과 가상서버에 프로젝트를 배포하는 과정이었다.

 

기존 코드

public ArrayList<String> findV0(){
    ArrayList<String> letters = new ArrayList<String>();
    FindIterable<Document> docs = fans.find();

    if (docs.cursor().hasNext()) {
        letters.add(docs.cursor().next().toJson());
    }
    return letters;
}

 

데이터의 구조는 {"name" : "jh" , "comment" : "김치 맛있어요"} 이렇다.

기존 코드의 경우 그냥 String이다. Json 형태를 가진 String이다.

나는 이 과정을 이해를 못했다. Json 형태인데 왜 인식을 못하지? 그냥 스트링이었기 때문이다.

"{"name" : "jh" , "comment" : "김치 맛있어요"}" 이렇게 생긴 스트링을 전달하고 있었던 것이었다.

 

for (let i = 0; i < response.length; i++) {
    let name = response[i]['name']
    let comment = response[i]['comment']

그래서 위 스크립트의 'name','comment' 라 키를 인식하지 못한다고 콘솔 창에서 알려준다.

 

변경 코드

public ArrayList<Letter> find(){

    ArrayList<Letter> letters = new ArrayList<Letter>();
    FindIterable<Document> docs = fans.find();

    for (Document doc : docs) {
        Letter letter = new Letter();
        letter.setName(doc.getString("name"));
        letter.setComment(doc.getString("comment"));

        letters.add(letter);
    }
   return letters;
}

1. Letter 라는 객체를 만들었다.

2. 객체를 만들어 db에 저장되어 있는 "name", comment" 의 value 값을 설정하도록 했다.

 

제이슨 형태로 응답한 이유는 @ResponseBody 애노테이션을 사용했기 때문이 아닐까 추측한다.

 

- P.S

가장 어려웠던건 원격 서버에 프로젝트를 배포하는 과정이었는데 언젠가 또 애먹을 것 같아서 따로 정리해뒀다