더보기 2023.04.19 - [프로그래밍/JAVA 프로그래밍] - 객체지향 프로그래밍의 기본 개념 이해하기 1편 - 객체지향 프로그래밍의 개념과 특징 안녕하세요, 이번에는 객체지향 프로그래밍의 상속과 다형성 개념에 대해 알아보겠습니다. 상속 상속(Inheritance)은 객체지향 프로그래밍에서 기존 클래스를 기반으로 새로운 클래스를 만드는 개념입니다. 상속을 통해 새로운 클래스는 기존 클래스의 속성과 메서드를 물려받아 사용할 수 있습니다. 이러한 상속을 통해 기존 클래스의 코드를 재사용하고, 중복 코드를 줄일 수 있습니다. 예시를 통해 상속 개념을 살펴보겠습니다. public class Animal { private String name; private int age; public Animal(Stri..
안녕하세요, 이번에는 객체지향 프로그래밍의 개념과 특징에 대해 알아보겠습니다. 객체지향 프로그래밍이란? 객체지향 프로그래밍(Object-Oriented Programming, OOP)은 컴퓨터 프로그래밍의 패러다임 중 하나입니다. 객체지향 프로그래밍에서는 모든 것을 객체(Object)로 취급합니다. 객체는 데이터와 해당 데이터를 처리하는 기능을 가진 프로그램의 단위입니다. 이러한 객체를 이용하여 프로그래밍을 하는 것이 객체지향 프로그래밍입니다. 객체지향 프로그래밍의 특징 1. 캡슐화(Encapsulation) 객체지향 프로그래밍에서는 데이터와 해당 데이터를 처리하는 기능을 하나로 묶어 캡슐화합니다. 캡슐화된 객체는 내부 구현을 숨기고, 외부에서는 객체의 인터페이스만을 통해 객체에 접근할 수 있습니다. 이..
더보기 2023.04.16 - [프로그래밍/JAVA 프로그래밍] - 자바의 컬렉션 프레임워크(Collection Framework) 살펴보기 1편 - 컬렉션 프레임워크 소개 및 List 인터페이스 2023.04.17 - [프로그래밍/JAVA 프로그래밍] - 자바의 컬렉션 프레임워크(Collection Framework) 살펴보기 2편 - Set 인터페이스와 Map 인터페이스 안녕하세요, 이번에는 자바의 컬렉션 프레임워크에서 공통적으로 제공되는 메서드와 자료구조 선택 기준에 대해 알아보도록 하겠습니다. 컬렉션 프레임워크의 공통 메서드 컬렉션 프레임워크의 모든 인터페이스는 공통적으로 다음과 같은 메서드를 제공합니다. add(E e) : 지정된 요소를 컬렉션에 추가합니다. remove(Object o) : 지..
더보기 2023.04.16 - [프로그래밍/JAVA 프로그래밍] - 자바의 컬렉션 프레임워크(Collection Framework) 살펴보기 1편 - 컬렉션 프레임워크 소개 및 List 인터페이스 안녕하세요, 이번에는 자바의 컬렉션 프레임워크 중 Set 인터페이스와 Map 인터페이스에 대해 자세히 알아보도록 하겠습니다. Set 인터페이스 Set 인터페이스는 중복되지 않는 데이터를 다루기 위한 인터페이스입니다. Set은 순서가 없는 데이터의 모음을 다루며, 중복된 데이터를 저장하지 않습니다. Set 인터페이스를 구현하는 대표적인 클래스로는 HashSet, TreeSet 등이 있습니다. HashSet 클래스 HashSet 클래스는 내부적으로 해시 테이블을 사용하여 데이터를 관리하는 Set 인터페이스의 구현 ..
컬렉션 프레임워크 소개 컬렉션 프레임워크(Collection Framework)는 자바에서 자료구조를 구현하고 관리하기 위한 클래스 라이브러리입니다. 이를 사용하면 다양한 자료구조를 쉽게 구현하고 관리할 수 있습니다. 컬렉션 프레임워크는 다음과 같은 특징을 가집니다. 다양한 자료구조 제공: List, Set, Map 등 다양한 자료구조를 제공합니다. 인터페이스와 구현 클래스 분리: 인터페이스와 구현 클래스를 분리함으로써, 자료구조를 사용하는 프로그래머는 구현 내용을 알 필요가 없습니다. 공통 메서드 제공: 모든 컬렉션 클래스에서 공통으로 사용되는 메서드를 제공합니다. 컬렉션 프레임워크는 java.util 패키지에 속해 있으며, 다양한 인터페이스와 클래스로 구성되어 있습니다. List 인터페이스 List ..
스택(Stack) 스택(Stack)이란? 스택(Stack)은 데이터를 넣고 빼는데 있어서 Last-In, First-Out (LIFO) 방식을 따르는 자료구조입니다. 즉, 가장 마지막에 넣은 데이터가 가장 먼저 빠져나가는 것을 말합니다. 스택은 컴퓨터 과학에서 매우 중요한 자료구조 중 하나이며, 다른 자료구조들과의 연계를 통해 다양한 문제를 효과적으로 해결할 수 있습니다. 스택(Stack)의 구현 스택은 배열(Array)을 통해 구현될 수 있습니다. 스택에 데이터를 삽입하는 연산을 push라 하며, 데이터를 삭제하는 연산을 pop이라고 합니다. 또한, 스택의 가장 상단에 위치한 데이터를 top이라고 합니다. public class Stack { private int[] stack; private int ..
1편에서는 클로저가 무엇인지와 클로저가 어떻게 동작하는지에 대해 알아보았습니다. 이번에는 클로저의 다른 중요한 개념인 "비공개 멤버"와 "콜백 함수"에 대해서 알아보겠습니다. 비공개 멤버 자바스크립트에서는 객체의 속성과 메서드를 외부에서 직접 접근할 수 있습니다. 하지만 때로는 외부에서 직접 접근할 수 없는 비공개 멤버를 가지는 객체가 필요합니다. 이를 위해 클로저를 사용할 수 있습니다. 예를 들어, 다음과 같이 Counter 함수를 정의해봅시다. function Counter() { var count = 0; function changeBy(val) { count += val; } return { increment: function() { changeBy(1); }, decrement: function..
클로저(Closure)란 무엇인가? 자바스크립트에서 클로저는 매우 중요한 개념 중 하나입니다. 클로저는 내부 함수가 외부 함수의 변수와 매개변수에 접근할 수 있는 것을 말합니다. 즉, 내부 함수가 생성된 시점에서 외부 함수의 변수와 매개변수를 기억하고 있는 것입니다. 이렇게 기억된 변수와 매개변수는 내부 함수가 호출될 때 사용됩니다. 클로저의 예시 아래의 예시 코드를 보면서 클로저를 이해해보도록 하겠습니다 function outerFunction(x) { function innerFunction(y) { console.log(x + y); } return innerFunction; } let newFunction = outerFunction(5); newFunction(3); // 결과: 8 위의 코드에..
앞선 글에서는 Java에서 정규식을 사용하는 방법과 간단한 예시를 살펴보았습니다. 이번 글에서는 Java에서 정규식을 사용하여 입력값의 유효성을 검사하는 방법에 대해 알아보겠습니다. 입력값의 유효성을 검사하기 위해서는 검사할 대상의 형식에 따라 적절한 정규식을 작성해야 합니다. 이메일 주소나 전화번호와 같은 형식이 정해져 있는 경우, 해당 형식에 맞는 정규식을 작성하여 검사할 수 있습니다. 또한, 입력값이 숫자인지, 알파벳인지, 혹은 특수문자인지 등을 검사하는데에도 정규식을 사용할 수 있습니다. 다음은 전화번호 유효성 검사를 위한 정규식 예시입니다. public static boolean isValidEmail(String email) { String regex = "^[A-Za-z0-9+_.-]+@[A..
지난번에는 Java에서 정규식을 사용하는 기본적인 방법을 알아보았습니다. 이번에는 좀 더 복잡한 정규식 패턴과 그것을 활용하는 방법에 대해 알아보겠습니다. 복잡한 패턴 작성하기 복잡한 패턴을 작성할 때는, 여러 패턴을 조합하거나, 반복되는 부분을 간결하게 나타내는 등의 방법을 사용할 수 있습니다. 다음은 이메일 주소를 검증하는 더 복잡한 예시 코드입니다. import java.util.regex.Matcher; import java.util.regex.Pattern; public class EmailValidator2 { private static final String EMAIL_REGEX = "^(([\\w-]+\\.)+[\\w-]+|([a-zA-Z]{1}|[\\w-]{2,}))@" +"((([0-1..
소개 Java는 문자열에서 특정한 패턴을 찾거나 검증하거나 가공하는 데 사용되는 정규식(regular expression)을 지원합니다. 정규식은 문자열을 다룰 때 매우 유용한 도구이며, Java에서도 많이 사용됩니다. 이번 글에서는 Java에서 정규식을 사용하는 기초적인 방법에 대해 알아보겠습니다. 정규식 패턴 정규식 패턴은 검색하려는 문자열 패턴을 정의하는 표현식입니다. Java에서는 java.util.regex 패키지를 이용하여 정규식을 사용할 수 있습니다. 정규식 패턴을 만드는 방법은 다음과 같습니다. import java.util.regex.Pattern; // 정규식 패턴 만들기 String regexPattern = "정규식 패턴"; Pattern pattern = Pattern.compil..
살다보면 스티커 메모처럼 위젯을 구현하고 싶을때가 온다.. 나만그럴수도있고 그럼 이 위젯을 어떻게 만들어야할까? 우선 GridLayout에서 만들것이므로 NewGrid.js import React, { useState } from "react"; import ResizableWidget from "./ResizableWidget"; import "./NewGrid.css"; const Grid = () => { const [widgets, setWidgets] = useState([ { id: "1", text: "Widget 1" }, { id: "2", text: "Widget 2" }, { id: "3", text: "Widget 3" }, ]); const handleRemoveWidget = (..
더보기 반응형 디자인 다크 모드 지원 미니멀리즘 디자인 그리드 레이아웃 인터랙티브한 애니메이션 타이포그래피 색상 팔레트 아이콘 라이브러리 사용 컴포넌트 라이브러리 활용 로딩 애니메이션 구현 사용자 피드백 제공 웹 접근성 사용자 피드백 제공 사용자의 행동에 따라 즉각적인 피드백을 제공하는 것이 중요하다. 버튼 클릭, 폼 제출 등의 상황에서 사용자에게 상태를 알려주는 것이 좋다. 또한 이걸 이용해서 다른 디자인에서도 뭔가 반응이 있다고 알려준다던지, 밋밋하지 않도록 Snackbar를 이용해서 보여주겠다. import library import { Button, TextField, Snackbar, Grid } from '@mui/material'; import { useState } from 'react';..
더보기 반응형 디자인 다크 모드 지원 미니멀리즘 디자인 그리드 레이아웃 인터랙티브한 애니메이션 타이포그래피 색상 팔레트 아이콘 라이브러리 사용 컴포넌트 라이브러리 활용 로딩 애니메이션 구현 사용자 피드백 제공 웹 접근성 컴포넌트 라이브러리 활용 UI 컴포넌트 라이브러리를 사용하면 일관된 스타일의 컴포넌트를 쉽게 구현할 수 있다. Material-UI, Ant Design, Bootstrap 등과 같은 라이브러리를 사용하면 더 빠르게 웹사이트를 구축할 수 있다. LoginForm.js import React from "react"; import { Box, Container, Typography, TextField, Button, FormControlLabel, Checkbox, } from "@mui/m..
더보기 반응형 디자인 다크 모드 지원 미니멀리즘 디자인 그리드 레이아웃 인터랙티브한 애니메이션 타이포그래피 색상 팔레트 아이콘 라이브러리 사용 컴포넌트 라이브러리 활용 로딩 애니메이션 구현 사용자 피드백 제공 웹 접근성 라이브러리 설치 npm install react-transition-group @mui/icons-material 색상 팔레트 좋은 색상 조합은 웹사이트를 더 매력적으로 만든다. 색상 팔레트를 선택할 때는 대조되는 색상이나 조화로운 색상을 사용하기가 좋다. 사이트 전체에서 일관된 색상 팔레트를 사용하면 더 전문적으로 보일 것이다. ColorPalette.js import React, { useState } from "react"; import { Box, Typography, Grid }..
더보기 반응형 디자인 다크 모드 지원 미니멀리즘 디자인 그리드 레이아웃 인터랙티브한 애니메이션 타이포그래피 색상 팔레트 아이콘 라이브러리 사용 컴포넌트 라이브러리 활용 로딩 애니메이션 구현 사용자 피드백 제공 웹 접근성 라이브러리 설치 npm install @react-spring/web @react-spring/core @mui/material @emotion/react @emotion/styled 인터랙티브한 애니메이션 사용자와 상호작용하는 애니메이션을 추가하면 웹사이트가 더 살아있게 느껴진다. framer-motion 같은 애니메이션 라이브러리를 사용하면 간편하게 애니메이션을 구현할 수 있다. 또한 @mui/system도 이용해서 구현해보겠다. 예시) framer-motion 와 @mui/syste..
더보기 반응형 디자인 다크 모드 지원 미니멀리즘 디자인 그리드 레이아웃 인터랙티브한 애니메이션 타이포그래피 색상 팔레트 아이콘 라이브러리 사용 컴포넌트 라이브러리 활용 로딩 애니메이션 구현 사용자 피드백 제공 웹 접근성 미니멀리즘 디자인 깔끔하고 간결한 디자인은 사용자들에게 인기가 많다. 불필요한 요소를 제거하고, 중요한 정보와 기능에 집중할 수 있도록 디자인해야 한다. MinimalLoginForm.js import React from "react"; import "../MinimalLoginForm.css"; const MinimalLoginForm = () => { return ( 로그인 로그인 ); }; export default MinimalLoginForm; MinimalLoginForm.cs..
더보기 반응형 디자인 다크 모드 지원 미니멀리즘 디자인 그리드 레이아웃 인터랙티브한 애니메이션 타이포그래피 색상 팔레트 아이콘 라이브러리 사용 컴포넌트 라이브러리 활용 로딩 애니메이션 구현 사용자 피드백 제공 웹 접근성 기초 설치 파일 npm install @mui/material @emotion/react @emotion/styled styled-components @mui/icons-material 반응형 디자인 다양한 디바이스에서 웹사이트가 제대로 작동하도록 반응형 디자인을 구현해야 한다. CSS의 미디어 쿼리를 사용하거나, 라이브러리나 프레임워크를 사용하여 구현할 수 있다. 예시) Material-UI를 이용한 반응형 디자인 import React from "react"; import { Cont..
시작하기 전 필요한 준비사항 React를 처음 설치하려면 Node.js와 npm(Node Package Manager)이 필요하다. 이 글에서는 Node.js와 npm의 설치 방법과 React 프로젝트를 생성하는 방법에 대해 설명할 것이다. Node.js 설치 및 확인 Node.js는 자바스크립트 런타임으로, React와 같은 라이브러리를 사용하여 웹 애플리케이션을 개발할 때 필요하다. Node.js를 설치하려면 다음 단계를 따르자. Node.js 공식 사이트에 접속한다. https://nodejs.org/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org LTS 버전을 다운로드하고 설치한다..
저번 시간에 chatGPT api 를 이용해서 react - spring boot 방식으로 chat gpt를 구현해봤다. 2023.03.24 - [프로그래밍] - React - Spring boot로 gpt api를 가져와서 간단하게 응답하는 웹페이지 구현하기 React - Spring boot로 gpt api를 가져와서 간단하게 응답하는 웹페이지 구현하기 gpt api를 이용해서 웹페이지 구축 - 백엔드편 Spring Initializr 이 사이트를 들어가서 maven 프로젝트와 dependencies에 Spring WEB, Lombok을 추가한다. 프로젝트를 연다. 열고나서 간단하게 package는 3개 만든다 haleta.tistory.com 하지만 저번 대답이 시원 찮았던 이유가, api를 가져와..
gpt api를 이용해서 웹페이지 구축 - 백엔드편 Spring Initializr 이 사이트를 들어가서 maven 프로젝트와 dependencies에 Spring WEB, Lombok을 추가한다. 프로젝트를 연다. 열고나서 간단하게 package는 3개 만든다. 1. config 2. controller 3. service 우선 config부터 설정한다. 파일명에 따라 다르겠지만, 나는 WebConfig.java를 만들었다. WebConfig.java import org.springframework.context.annotation.Configuration; import org.springframework.web.servlet.config.annotation.CorsRegistry; import org..
@JPA 엔티티와 데이터베이스 테이블 간의 매핑을 위한 어노테이션 JPA는 객체와 관계형 데이터베이스 간의 매핑을 수행하는 기술이다. 이를 위해 JPA에서는 @Entity와 @Table 어노테이션을 사용한다. @Entity는 JPA 엔티티임을 나타내고, @Table은 엔티티와 매핑되는 데이터베이스 테이블의 이름을 지정한다. 이 두 어노테이션의 차이점에 대해서 알아보도록 하겠다. @Entity 어노테이션 @Entity 어노테이션은 JPA에서 엔티티 클래스임을 나타내기 위해 사용된다. 엔티티 클래스란, 객체와 관계형 데이터베이스 간의 매핑을 수행할 대상이 되는 클래스를 의미한다. 즉, JPA에서 엔티티 클래스는 데이터베이스 테이블과 매핑되는 클래스이다. @Entity 어노테이션은 다음과 같은 속성을 가질 수..
JPA를 이용하면서 자동으로 쿼리를 만들어주는데, 어떻게 하면 JPA에서 like 조회를 진행하는지에 대해서 궁금해졌다. 이런저런 정보글들을 찾아보고, 실제로 적용이 되서 나온 경우를 몇가지 적겠다. 1. JpaRepository 이용, like 조회방법 @Repository public interface UserRepository extends JpaRepository { List findByUsernameContaining(String keyword); } 컬럼명 + Containing 을 이용한다. 위 예제코드처럼 findByUsernameContaining 이라고 쓰고, 뒤에 받아올 키워드를 작성하면된다. 이를 이용해서 만약 키워드 자체가 없을땐 전체 조회, 키워드가 존재할경우 like 조회하는 ..
해당 에러는 컴파일 에러가 아닌 런타임 에러임. 따라서 빨간줄이 나타나지 않을 수 있다. (컴파일 에러일경우에만 빨간줄 발생) 위 에러 메시지는 스프링 부트가 빈으로 등록되어야 하는 서비스나 컴포넌트를 찾지 못해서 발생하는 에러다. 스프링 부트 애플리케이션에서는 빈으로 등록되어야 하는 클래스를 @Service, @Component, @Repository 등의 어노테이션으로 표시하여 스프링에게 빈으로 등록하도록 지시를 해야한다. 만약 위 에러가 발생한다면, 해당 빈이 스프링 컨테이너에 등록되지 않았다는 뜻이다... 이 경우에는, 빈을 등록하는 방법으로는 다음과 같은 방법들을 조치해야한다. 해당 클래스에 @Service, @Component, @Repository 등의 어노테이션을 추가하여 빈으로 등록 해당..
SpringBoot로 개발하다보면 @NotNull과 @NotBlank 가 필요할때가 있다. Maven Repository - POM file for Validation validation-api 1.1.0.Final 1.1.0.Final (java2s.com) Maven Repository - POM file for Validation validation-api 1.1.0.Final 1.1.0.Final Bean Validation API. Here is the list of declaration for validation-api. If you use Maven you can use the following code to add the dependency for this POM file. If you t..
필요 목적에 따라 input type date 를 쓸때가 있다. 이걸 쓸때 안에 값을 넣어줄때는 꼭 항상 yyyy-MM-dd 형태로 하이픈까지 들어가야하는데 이걸 쉽게 구해보려고 한다. // yyyy-MM-dd 형식의 문자열 날짜 데이터 var dateString = "2022-02-28"; // 문자열 형식의 날짜 데이터를 Date 객체로 변환 var dateObj = new Date(dateString); // 다음 날짜 구하기 dateObj.setDate(dateObj.getDate() + 1); // 결과 출력 var nextDateString = dateObj.getFullYear() + "-" + (dateObj.getMonth() + 1) + "-" + dateObj.getDate(); co..
StackOverflowError : null JPA에서 @OneToOne 양방향 매핑을 사용하고 에러가 났었다. 에러 내용은 StackOverflowError : null 왜떴나 싶었더니 Entity 연관관계를 맺을때 내가 실수한 부분이 몇개 있었다. @OneToOne(mappedBy = "ParentEntity" , orphanRemoval = true, cascade = CascadeType.ALL, fetch = FetchType.LAZY, optional = false) private ChildEntity childEntity; 부모가 될 Entity 설정이고, @OneToOne(fetch = FetchType.EAGER) @JoinColum(name = "parentEntity_id") pri..
코딩테스트 연습 - 문자열 밀기 | 프로그래머스 스쿨 (programmers.co.kr) 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문자열 밀기 문자열 밀기 문제 설명 문자열 "hello"에서 각 문자를 오른쪽으로 한 칸씩 밀고 마지막 문자는 맨 앞으로 이동시키면 "ohell"이 됩니다. 이것을 문자열을 민다고 정의한다면 문자열 A와 B가 매개변수로 주어질 때, A를 밀어서 B가 될 수 있다면 밀어야 하는 최소 횟수를 return하고 밀어서 B가 될 수 없으면 -1을 return 하도록 solution 함수를 완성해보세요. 제한사항 0