Cafe POS를 개발하면서 프론트엔드 코드는 React.js을 기본으로 해서, SSR 기능이 있는 Next.js와 코드의 안정성을 위한 TypeScript을 함께 사용해 작성하고 있다. 특히 React.js가 여러 컴포넌트를 조합해서 동적으로 UI를 만드는 특징을 갖고있는 만큼 파일이 많아질 수밖에 없어서 여러 파일들을 쉽게 관리하기 위해서 다음과 같이 폴더를 구조화했다. /my-app |-- /src |-- /components |-- /MenuPanel |-- MenuPanel.tsx |-- MenuBlock.tsx |-- Category.tsx |-- /NavBar |-- Clock.tsx |-- NavBar.tsx |-- MenuEditorForm.tsx |-- MenuOrderForm.tsx ..

cafe에서 흔히 사용하는 pos 프로그램을 만들면서, 화면에 현재 시간이 보일 수 있도록 new Date()로 useEffect를 사용해 처음 화면이 rendering되었을 때에만 현재 시간을 가져오게끔 의존성 배열도 [] 빈 배열로 만들어두었다. 다른 코드를 쓰다가 쓴 코드를 확인하려고 브라우저에서 실행해둔 페이지를 확인했는데 뜬 에러를 보고 "아까까지 잘만 되던 게 왜 안 되지?" 하고 당황해서 에러 메시지를 잘 읽어봤다. 이유인 즉슨, SSR를 기본적으로 지원하는 Next.js과, CSR을 기본적으로 지원하는 React.js 간의 차이 때문에 충돌이 발생했던 것..! Next.js와 React.js를 함께 쓰게 되면, 처음에는 Next.js로 SSR 된 HTML을 클라이언트로 가져와서, 그 다음부..

Gradle은 의존 관계(dependency)가 있는 라이브러리를 함께 다운로드함. Spring Boot Libraries 스프링 부트 라이브러리 ♬ spring-boot-starter-web ♪ spring-boot-starter-tomcat: 톰캣(웹서버) ♪ spring-webmvc: 스프링 웹 MVC ♬ spring-boot-starter-thymeleaf: 타임리프 템플릿 엔진(View) ♬ spring-boot-starter(공통): 스프링 부트 + 스프링 코어 + 로깅 ♪ spring-boot ♩ spring-core ♪ spring-boot-starter-logging ♩ logback, slf4j 조합을 많이 이용함. Test Libraries 테스트 라이브러리 ♬ junit: 테스트 프..

Spring 강좌로 유명하시다는 김영한님 입문 강의를 듣기 시작했다. 첫 번째, 두 번째 강의를 따라서 Spring 프로젝트 만들기에 돌입했다. 이제 조금 익숙해지나 싶었던 Eclipse가 아닌 다른 IDE인 Intellij를 사용하길 권장하신다는 강사님 말씀에 얼른 따라 설치했다. https://start.spring.io/ 스프링 프로젝트를 바닥에서부터 하나하나 만들던 예전과는 달리 이제는 간편하게 스프링 부트를 기반으로 프로젝트를 생성해주는 곳이라고 한다. 근데.. 응? 아무 것도 모른 채 일단 따라 만들고 그 파일을 Intellij에서 오픈했는데 저 화면에서 발생한 오류가 두 가지나 있었다. 첫 번째, Cannot resolve symbol 'String' 두 번째, Cannot resolve m..

Java의 라이브러리를 API라고 부른다. 라이브러리란? 프로그램을 만드는 데 필요한 주요 기능들을 미리 만들어 둔 것. 워낙 다양해서 이를 이용하면 쉽고 빠르게 애플리케이션 개발 가능. (여기서 애플리케이션은 우리가 흔히 말하는 모바일 앱이 아니라 '컴퓨터 프로그램'이라는 뜻) Java API가 제공하는 기능에 뭐가 있는지 상세한 정보를 제공하는 html 파일을 Java API 문서라고 부른다. 구글에 검색하면 Java 8 버전에 맞는 API 다운로드 사이트가 제일 위에 나타나지만.. 또 말 안 듣는 업데이트 홀리커는 API 문서 최신 버전을 찾아 나섰다...ㅋㅋㅋ https://www.oracle.com/java/technologies/javase-jdk19-doc-downloads.html Java..