🧱 개발 환경 설정 1. Node.js & Vue CLI 설치 node -v # 18.16.0 npm install -g @vue/cli vue --version # Vue CLI v5.0.8 2. Vue 프로젝트 생성 vue create mes-view # preset: Vue 3 + Babel + E...

현장에서 MES시스템을 보면서 항상 호기심을 가지고 있었다. 그래서! 이번 토이프로젝트의 주제는 MES시스템으로 결정했다. 이제 실제 업무 흐름과 데이터 연관관계에 기반한 구조를 설계하고 개발하는 단계에 들어섰다. ✅ 오늘 목표 프로젝트 기획 DB 설계 API 구현(Product, WorkOrder, Equipment, Produ...

오늘은 드디어 내가 만든 API들을 Swagger로 문서화하고 직접 테스트할 수 있도록 적용해봤다. ✅ 오늘 목표 예외 처리를 위한 GlobalExceptionHandler 적용 Swagger(OpenAPI 3)를 프로젝트에 적용해서 API 문서 자동화 Postman 없이 API 테스트 가능하게 만들기 🚨 예외 처리 Glob...

✅ 오늘 구현한 기능 Spring Data JPA를 이용해 사용자(User) 데이터를 다루는 CRUD REST API를 만들어봤다. Method URL 설명 GET /users 전체 사용자 조회 POST ...

항상 MyBatis만 사용하고 ORM 쪽을 깊게 다뤄보지 않아서, 이번 기회에 JPA를 학습해보려고 한다. 학습겸 토이프로젝트를 통해서 실무감각도 키워보자. ✅ 개발 환경 Java 17 Spring Boot 3.4.5 Spring Data JPA MySQL 8.0 Lombok STS(Spring Tool Suite) ...

요즘 코딩테스트 문제 푸는것에 재미를 느껴 여러 문제를 풀던 중 최악의 테스트 케이스에서 시간 초과가 발생하여 문제 통과를 못하는 경험을 하게 되어 시간복잡도의 개념에 대해 공부하기 시작했다,,! 시간복잡도 ① 입력 크기와 알고리즘간의 관계 ② 입력 크기에 대해 프로그램의 동작시간을 가늠해볼 수 있는 수단 ③ Big-O / Big-Omega / B...

Object 클래스는 모든 클래스의 최상위 클래스 아무것도 상속받지 않으면 자동으로 Object를 상속받고, Object가 가지고 있는 메서드는 모든 클래스에서 사용할 수 있다는 것을 의미한다. Object 클래스에서 가장 많이 사용되는 메서드 equals - 객체가 가진 값을 비교할 때 사용 hashCode - 객체의 ...

async & await란? async와 await는 javascript의 비동기 처리 패턴 중 가장 최신 문법이다. 기존의 비동기 처리 방식인 콜백 함수와 프로미스의 단점을 보완하고 개발자가 읽기 좋은 코드를 작성할 수 있게 도와준다. 읽기 좋은 코드가 뭐지? 처음 프로그래밍을 배울때 아래와 같이 변수와 조건문을 사용하여 개발하였다....

Promise란? 프로미스는 자바스크립트 비동기 처리에 사용되는 객체이다. 비동기 처리에 대한 내용은 “javascript 비동기 처리 - hyoin” 에서 확인하자. Promise가 왜 필요한가? 프로미스는 주로 서버에서 받아온 데이터를 화면에 표시할 때 사용한다. 일반적으로 웹 애플리케이션을 구현할 때 서버에서 데이터를 요청하고 받아오기...

UI에서 데이터처리를 할 때, 비동기 처리를 통해 서버와의 통신을 한다. 서버와의 통신을 할 때, 왜 비동기 처리를 해야하는가? 동기와 비동기 만약, 카페에 방문해서 커피를 주문할 때, 직원이 1명이라면, 한명이 주문을 받고 난 후 커피를 만들고, 만든 커피가 전달이 된 후 다음 손님의 주문을 받을 수 있다. 마치 큐(자료구조 형식)처럼 선입...