코딩짜는 일상

📚 서론이번주는... 제가 최근에 어마어마한 업보 청산을 당해서......그것에 대해 기록 해볼까 합니다.🥲 시작은 2개 이상의 테이블을 JOIN하여 데이터를 가져올 때2개 테이블들의 필드가 전부 있는 별도의 DTO를 만들어야 하는 번거로움에서 시작되었습니다. 이때 강사님께 Map를 사용하여 데이터를 받는 방법도 있다고 조언 받았고 단일 테이블을 조회하는 게 아니면 대부분 Map을 이용하여 서비스를 구현하게 되었습니다.🤪 프로젝트 초반에는 별 문제가 없었는데중반 쯤 지나 구현할 리엑트 컴포넌트가 늘어나면서작업을 좀 줄여보려고 컴포넌트를 분리하고 재사용하면서 문제가 생겼습니다.😓 1️⃣ 필드명 스타일 통일의 필요성오라클은 큰따옴표(")를 쓰지 않는 한 대소문자 구분을 하지 않습니다. 때문에 테이..

📚 서론스프링 부트로 프로젝트를 만들면 바로 실행할 수 있을만큼 대부분의 설정이 완료되어 있지만뷰 파일 만큼은 특별히 강제하는 스타일이 없기 때문에 따로 설정해 주어야 합니다. 지금까지 강의를 배우면서 배운것이 JSP였기 때문에이번 팀 프로젝트도 스프링 부트 프로젝트에 JSP의존성을 추가하였습니다. 근데 여기서 문제가 하나 생깁니다. 지난주 포스트였던 비동기 통신을 통해 데이터를 받아온 다음직접 html태그를 작성하고 jQuery나 Javascript를 이용해 브라우저 화면에 삽입하도록 만들면 일단 만드는 작업이 너무 번거로운데다 내용이 조금만 더 길어지면 수정하는 일이 쉽지 않았습니다. 그래서 비동기 통신을 요청하면 데이터를 별도의 JSP 파일로 전달하고거기서 html 태그를 구성한 다음 통째로 ..

📚 요약리액트를 시작하고자 한다면 필수 디렉터리와 파일들 만들고 리액트 라이브러리를 설치하고...🥹 이것저것 과정이 많고 생각보다 시간이 오래 걸리기에 node.js를 이용해 명령어 한 줄로 자동 생성하는 방법을 정리해볼 것이다!😎✨ 🎷VS Code에서 파워쉘(PowerShell) 사용하기가장 먼저 리액터 앱을 만들어줄 위치를 선정하고 VS Code의 최상단 메뉴에서 파일(File) => 폴더 열기(Open Folder) 를 선택해 해당 경로를 열어준다. 나는 C에 Workspace를 만들어 두고 쓰는데 여기에 따로 reactWorkspace폴더를 만들었다. 이제 VS Code에서 ctrl + ` 키를 누르면 하단에 터미널 창이 생긴다. 창 내용을 보면 내가 vs code에서 연 폴더..

📚 요약이번주엔 뭘 작성할까 고민하다가 최근 노트북을 바꾸면서 (무려 12년만에...😭)개발 환경 세팅이 생각보다 자주 찾아보게 된다는 걸 깨달았다. 블로그에 저장해두면 나도 찾아보기 쉽고😎다른 사람들도 자주 찾아주지 않을까 해서 정리해보기로 했다! VS Code 설치Extention 설치Node.js 설치순서로 풀어보겠다! 🎷 VS Code 설치수업은 VS Code의 터미널을 통해 빠르게 리액트 앱을 생성해주어야 하므로VS Code가 필수다! 가장 먼저 검색에 [VS Code]를 입력해준다.https://code.visualstudio.com/ Visual Studio Code - Code Editing. RedefinedVisual Studio Code redefines AI-powered..