전체 글 (754) 썸네일형 리스트형 [2025 1학기 스프링부트 스터디] 김민서 #3주차 비즈니스 요구사항 정리 웹 애플리케이션 계층 구조컨트롤러: 웹 MVC의 컨트롤러 역할서비스: 핵심 비즈니스 로직 구현리포지토리: 데이터베이스 접근, 도메인 객체를 DB에 저장하고 관리도메인: 비즈니스 도메인 객체, 데이터베이스에 저장하고 관리되는 것들구현 상황 가정데이터: 회원 아이디, 이름기능: 회원 등록, 조회아직 데이터 저장소가 선정되지 않음 -> 인터페이스로 구현 클래스를 변경할 수 있도록 설계데이터 저장소는 RDB, NoSQL 등 고민중초기 개발 단계에서는 가벼운 메모리 기반의 데이터 저장소 사용 회원 도메인과 리포지토리 만들기 회원 객체package hello.hello_spring.domain;public class Member { private Long id; private St.. [2025 1학기 스프링부트 스터디] 정다은 #3주차 이번강의는🚀 섹션 4. 회원관리 예제 - 백엔드 개발🚀입니다! 1. 🛸 비즈니스 요구사항 정리데이터 : 회원 ID, 이름기능 : 회원 등록, 조회아직 데이터 저장소가 선정 X (라는 가상 시나리오 설정)아주 단순한 기능만 구현 예정입니다. 일반적인 웹 애플리케이션 계층 구조컨트롤러 : 웹 MVC의 컨트롤러 역할서비스 : 핵심비즈니스 로직 구현 (ex. 회원중복가입 안됨 등등)리포지토리 : 데이터베이스에 접근, 도메인 객체를 DB에 저장하고 관리도메인 : 비즈니스 도메인 객체 (ex. 회원, 주문, 쿠폰 등등) 주로 데이터 베이스에 저장하고 관리됨. 클래스 의존관계아직 데이터 저장소가 선정되지 않아서, 우선 인터페이스로 구현 클래스를 변경할 수 있도록설계 데이터 저장소는 RDB, NoSQL 등등 다.. [2025 1학기 스프링부트 스터디] 고윤정 #3주차 섹션4) 회원 관리 예제 - 백엔드 개발3주차 스터디 시작합니다 ~~비즈니스 요구사항 정리• 컨트롤러 : 웹 MVC의 컨트롤러 역할 (api 등을 만들때)• 서비스 : 도메인 객체를 가지고 핵심 비즈니스 로직 구현 (ex. 회원은 중복 가입이 안 됨)• 도메인 : 회원, 주문, 쿠폰 등 데이터베이스에 저장하고 관리되는 비즈니스 도메인 객체• 리포지토리 : 데이터베이스에 접근, 도메인 객체를 DB에 저장하고 관리회원 리포지토리는 인터페이스로 설계 -> 아직 데이터 저장소가 선정되지 않음일단 개발을 진행하기 위해 가벼운 메모리 기반의 데이터 저장소를 구현체로 사용한다. (구체적인 기술들이 선정되고 나면 바꿔끼움)회원 도메인과 리포지토리 만들기실습을 하면서 배워봅시당도메인을 만들고 리포지토리를 인터페이스로 만.. [2025 1학기 스프링부트 스터디] 이상래 #3주차 👀 비즈니스 요구사항 정리데이터: 회원ID, 이름기능: 회원 등록, 조회아직 데이터 저장소가 선정되지 않음(가상의 시나리오)웹 애플리케이션 계층 구조 컨트롤러: 웹 MVC의 컨트롤러 역할서비스: 핵심 비즈니스 로직 구현리포지토리: 데이터베이스에 접근, 도메인 객체를 DB에 저장하고 관리도메인: 비즈니스 도메인 객체, 예) 회원, 주문, 쿠폰 등등 주로 데이터베이스에 저장하고 관리됨 클래스 의존관계 아직 데이터 저장소가 선정되지 않아서, 우선 인터페이스로 구현 클래스를 변경할 수 있도록 설계데이터 저장소는 다양한 저장소를 고민중인 상황으로 가정개발을 진행하기 위해서 초기 개발 단계에서는 구현체로 가벼운 메모리 기반의 데이터 저장소 사용👀 회원 도메인과 리포지토리 만들기도메인 모델id, name 필드를 .. [2025 1학기 스프링부트 스터디] 최비성 #3주차 섹션 4. 회원 관리 예제 - 백엔드 개발 비즈니스 요구사항 정리 1. 데이터 저장소가 선정되지 않고 개발해야 한다는 가정하에 실습을 진행한다.2. interface로 구현체를 만들고 메모리에 저장하는 방식으로 진행할 것이다. 회원 도메인과 리포지토리 만들기 Member 도메인 생성.package wink.spring_boot_study.domain;public class Member { private Long id; private String name; public Long getId() { return id; } public void setId(Long id) { this.id = id; } public String getName() { return name; }.. [2025 1학기 React.js 스터디] 이가인 #3주차 1. JSX 이해하기2. props 사용법3. 조건부랜더링4. useState : 동적인 값 관리하기5. input 상태 관리하기6. 여러개의 input 상태 관리 7. 과제 보여주깅 JSX리액트에서 생김새를 정의할 때 사용하는 문법- 리액트에서 컴포넌트를 만들 때 화면에 보일 구조를 쉽게 표현할 수 있게 도와줌return 안녕하세요; Babel 자바스크립트의 문법을 확장해주는 도구 JSX -> JS 변환 제대로 되기위한 규칙1. 닫혀잇는태그2. 두 개 이상의 태그는 무조건 하나의 태그로 감싸져 있어야함. -> 번거로움 -> Fragment(리액트요소) 사용 Fragment - - 별도의 엘리먼트로 나타나지않음 3. JSX 내부에 자바스크립트 변수 보여주기 { } 으로 감싸기 4. JSX 에서 태그에 .. [2025 1학기 React.js 스터디] 이종민 #3주차 리엑트가 만들어진 이유숙련된 JavaScript 개발자라면, 코드를 최대한 깔끔하게 정리하여 쉽게 유지보수를 할 수도 있겠지만, 대부분의 경우 웹 애플리케이션의 규모가 커지면, DOM 을 직접 건드리면서 작업을 하면 코드가 난잡해지기 쉽습니다. 리액트는 어떠한 상태가 바뀌었을때, 그 상태에 따라 DOM 을 어떻게 업데이트 할 지 규칙을 정하는 것이 아니라, 아예 다 날려버리고 처음부터 모든걸 새로 만들어서 보여준다면 어떨까? 라는 아이디어에서 개발이 시작되었습니다.우선 src 디렉터리에 Hello.js 파일을 작성했습니다.export default Hello;이 코드는 Hello 라는 컴포넌트를 내보내겠다는 의미입니다. 이렇게 해주면 다른 컴포넌트에서 불러와서 사용 할 수 있습니다.Hello 컴포넌트를 .. [2025 1학기 스프링부트 스터디] 오세웅 #3주차 비즈니스 요구사항 정리회원ID와 이름을 데이터에 저장, 회원 등록 및 조회 기능을 구현하는데아직 데이터 저장소가 선정되지 않았다는 가상의 시나리오가 있습니다.데이터 저장소가 선정되지 않았다는게 모르겠지만 일단 넘어가겠습니다. 컨트롤러에서 브라우저의 요청을 받아서 서비스에서 핵심 비즈니스 로직을 거친 후리포지토리를 통해 데이터베이스에 접근하여 도메인 객체를 DB에 저장하고 관리합니다.도메인은 비즈니스 도메인 객체로 주로 데이터베이스에 저장하고 관리를 한다는데 무슨 말인지 이해를 못했습니다..그래서 조금 더 찾아봤는데 서비스에서는 "언제, 어떻게"를 정하는 거고도메인에서 "무엇을 해야 하는가"를 정하는 거라고 합니다. 이게 클래스 의존 관계인데 데이터 저장소가 선정되지 않아서 interface를 먼저 만듭니.. [2025 ROS 스터디] 장우혁 #1주차 - ROS 소개 및 설치 Ch 1. 로봇 소프트웨어 플랫폼 1) 스마트폰과 컴퓨터의 공통점 - 둘 다 대중화된 상품 - 다양한 하드웨어가 결합 가능한 구조 - 운영체제(OS) + 애플리케이션(App) → 하드웨어 모듈 + 운영체제 + 앱(서비스) + 유저 = 하나의 생태계 2) 소프트웨어 플랫폼이 가져온 변화 - 하드웨어 인터페이스가 통합됨 - 하드웨어를 추상화, 규격화, 모듈화해서 가격은 낮추고 성능은 향상 - 하드웨어, 운영체제, 앱이 분리됨 → 개발자는 사용자 니즈에 맞춘 서비스 개발에 집중할 수 있음 - 구매 → 사용자 수 증가 → 피드백 → 생태계 순환 구조 형성 3) 로봇 분야 - 현재 여러 로봇 운영체제가 존재함 (ex. NAOqi, ROS, OPROS 등) - 가장 많이.. [2025 1학기 React.js 스터디] 최은희 #3주차 #1. 리액트는 어쩌다 만들어지게 되었을까?dom을 직접 조작하면서 만든 웹앱은 규모가 커질수록 복잡해지는데,이를 효율적으로 다루기 위해 만들어짐. 상태가 변하면 그에 맞춰 자동으로 UI가 업데이트됨.=> 복잡한 웹 UI를 덜 복잡하고 효율적으로 만들기 위해 만들어짐! #3. 리액트 컴포넌트*컴포넌트: 화면에 보여줄 부분을 만드는 코드(예를 들면 버튼 하나, 헤더 메뉴, 카드 하나 등...) *컴포넌트를 만드는 방법1.함수형 컴포넌트2.클래스형 컴포넌 *JSM: 보기에는 html처럼 생겼지만 내부에서는 자바스크립트 코드로 변환시켜줌 *함수형 컴포넌트 만들기1. scr폴더 안에 컴포넌트용 .js 파일을 새로 만든다.2. 파일 안에 컴포넌트 코드를 작성한다.function MyComponent() { re.. [2025 1학기 React.js 스터디] 백채린 #3주차 1. 리액트는 어쩌다 만들어졌을까? 사용자와의 인터랙션이 자주 발생➡️ 처리해야 할 이벤트, 관리해야 할 상태값, DOM이 다양해지게 되고 규칙도 많이 복잡해짐➡️ Ember, Backbone, AngularJS 등의 프레임워크가 만들어짐* 이 프레임워크들은 자바스크립트의 특정 값이 바뀌면 특정 DOM의 속성이 바뀌도록 연결해서 업데이트 💡 상태가 바뀌었을 때, 아예 처음부터 새로 만들어서 보여주자는 아이디어에서 리액트가 시작❓ 근데 이러면 속도가 매우 느리게 되지 않나?? 그래서 리액트에서는 Virtual DOM을 사용함* 브라우저에 보여지는 DOM이 아닌 메모리에 가상으로 존재하는 DOM으로, JavaScript 객체이기 때문에 속도가 훨씬 빠름즉, DOM의 상태를 메모리에 저장하고, 변경 전과.. [2025 1학기 React.js 스터디] 한혜민 #3주차 ✅ 리액트는 어쩌다 만들어졌을까? 리액트를 본격적으로 배우기 전에, 이 라이브러리가 왜 만들어졌는지 먼저 알아보는 건 매우 중요합니다.JavaScript만으로 UI를 만들면 벌어지는 일초기에 우리가 웹에서 UI를 만들 때는 JavaScript와 HTML만으로 동적인 화면을 구성했습니다. 버튼 클릭 시 DOM을 직접 조작하여 값을 바꾸고, 이벤트에 따라 요소들을 추가하거나 제거하는 방식이었죠. 하지만 이렇게 작성된 코드는 점점 복잡해지고 유지보수가 어려워졌습니다. 상태가 많아지면 어디서 어떤 DOM을 조작했는지 추적하기 어려워졌고, 같은 UI를 다른 페이지나 상황에서도 반복해서 쓰고 싶을 때도 비효율적이었습니다. 그래서 나온 해결책, 리액트페이스북 개발팀은 이런 문제를 해결하기 위해 리액트를 만들었습니.. [2025 1학기 스프링부트 스터디] 최비성 #2주차 [스트링 입문] 섹션 3. 스프링 웹 개발 기초 정적 컨텐츠1. 브라우저에서 hello-static.html이라는 경로로 접속을 하면2. 먼저 hello-static 관련 컨트롤러를 찾는다. 만약 컨트롤러가 없다면3. resources/static/hello-static.html 파일을 찾는다.4. 해당 파일을 브라우저에 건내준다. MVC와 템플릿 엔진 1. hello-mvc 경로로 접속2. 관련 컨트롤러를 찾는다.3. 컨트롤러가 있으면 작업을 처리하고 템플릿 엔진은 viewResolver에게 key와 value값을 템플릿 엔진 처리 하도록 한다.4. key value가 적용된 html파일이 브라우저에 전송된다. 아래와 같은 코드가 바로 controller 코드이다. @GetMapping("h.. [2025 1학기 React.js 스터디] 정채은 #3주차 리액트를 버억 ~ 킹킹킹 ~ 1. 리액트 생성 이유 돔 관리를 위해그런데 돔 상태 바뀔 때, 다 날려버리고 새로 만들어서 보여주는거 어떨까 하는 생각 -> 리액트 진짜 날리면 답없어서 Virtual DOM 사용해서 가능하게 함 Virtual DOM : 가상 돔. 2. 개발환경 준비 으하하 저는 프로젝트를 한번 해보아서 ...작업환경이 세팅이 되어잇씁니다 !!! 우하하 !!! 저는 그리고 yarn 을 사용하지 않고 npm 이 익숙해서 npm 으로 하겟습니다. 3. 얌얌의 first 리액트 컴포넌트. import React from 'react';첫줄 : 리액트 불러오는 코드. export default Hello;마지막줄 : 컴포넌트 내보내겟다는 뜻 ReactDOM.render 의 역할 : .. [2025 1학기 알고리즘 스터디] 박현빈 #2주차 Dynamic Programming동적 계획법, 다이나믹 프로그래밍(Dynamic Programming, DP) : 큰 문제를 작게 나누고, 같은 문제라면 한번씩만 풀어 문제를 효율적으로 해결하는 알고리즘 기법이다.최적의 해를 구하는 문제는 많은 연산 시간과 메모리가 필요해 컴퓨터로도 해결하기 어려운 문제이다. 이러한 문제들 중에서 특정 문제는 메모리 공간을 약간 더 사용하면 연산 속도를 비약적으로 상승 시킬 수 있다. 기존의 알고리즘이 해결하지 못하는 문제들 중 다이나믹 프로그래밍 기법을 통해서 해결할 수 있는 문제가 있다. 대표적인 예시로 피보나치 수열이 있다.DP 기법을 적용시키기 위한 조건다이나믹 프로그래밍을 사용하기 위해서는 해당 하는 문제가 다음 2가지 조건을 만족해야 한다.최적 부분 구조(O.. [2025 1학기 알고리즘 스터디] 김민재 #2주차 가장 긴 증가하는 부분 수열import java.util.Scanner;public class Main { public static void main(String[] args) { Scanner sc = new Scanner(System.in); int n = sc.nextInt(); int[] arr = new int[n+1]; int[] dp = new int[n+1]; for (int i = 1; i 1로 만들기import java.util.Scanner;public class Main { public static void main(String[] args) { Scanner sc = new Scanner(Sy.. [2025 1학기 React.js 스터디] 강민지 #3주차 3주차 리액트시~~작~!0. 리액트는 어쩌다 만들어졌을까?"DOM 업데이트를 어떻게 해야 할 지" (X)"Virtual DOM을 통해 처음부터 모든걸 새로 만들자" (O)1. 리액트 컴포넌트 만들기*컴포넌트 = UI를 구성하는 조각들 (1) begin-react > src > Hello.js 파일 만들기 (무조건 h는 대문자로!!)(2) 터미널에 npm start 입력 -> react app에 안녕하세요 출력(3) 다른 파일에 import Hello from './Hello'; 입력 -> 불러오기 기능ReactDOM.render : DOM 내부에 리액트 컴포넌트를 렌더링렌더링된 결과물 -> div 내부2. JSXbabel(문법 확장 도구)이 JSX 를 JavaScript 로 변환시킴: 브라우저는 JSX .. [2025 1학기 알고리즘 스터디] 김규현 #2주차 1. 1로 만들기연산을 최소한으로 사용하여 정수 x를 1로 만드는 문제이다.3의 배수인 경우 3으로 나누기, 2의 배수이면 2로 나누기, 1을 빼주는 연산중에 선택할 수 있다. 입력된 정수를 위의 과정중 하나를 선택하여 연산하여야하는데 2의 배수나 3의 배수 둘다 아닌 경우는 1을 빼주는 것이 자명해 보인다. 3의 배수이면 3으로 나누어주는 것이 가장 좋아보인다. 1로 만드는 과정에서 수를 최대한 줄여야하는데 3가지 과정중에 3으로 나누어 주는 것이 가장 수를 작게 만드는 방법이기 때문이다. 문제는 2의 배수인 경우이다. x가 10인 경우 2로 나누어 (10 -> 5 -> 4 -> 2 -> 1) 계산하는 방법보다 (10 -> 9 -> 3 -> 1)이 최소한으로 계산하는 경우이이 때문이다. 따라서 -1을.. [2025 1학기 React.js 스터디] 이승준 #3주차 ✅ React.js가 탄생하게된 이유리액트가 탄생하게 된 이유에 대해서 작성해보겠습니다...0 +1 -1const number = document.getElementById('number');const increase = document.getElementById('increase');const decrease = document.getElementById('decrease');increase.onclick = () => { const current = parseInt(number.innerText, 10); number.innerText = current + 1;};decrease.onclick = () => { const current = parseInt(number.innerText, 10.. [2025 1학기 알고리즘 스터디] 김민주 #2주차 알고리즘 스터디 2주차 : DP 1. 1로 만들기 https://www.acmicpc.net/problem/1463 💡문제 분석 및 알고리즘 설계처음에는 2 or 3의 배수이면 무조건 나누기 먼저한 후에 -1을 해서 1을 만드는 방식으로만 구현했었는데,10의 경우, " -1 => /3 => /3 " 의 순서대로 행하는 것이 최소 연산 횟수임을 알게 되었습니다. 따라서 두 방식으로 모두 계산하면서 그 중 최소값을 취하는 방식으로 설계하게 되었습니다. #include #include #include using namespace std;int n;int DP[1000000];void calc(int i){ DP[i] = DP[i-1] + 1; if (i%2 == 0) { DP[.. [2025 1학기 알고리즘 스터디] 신지은 #2주차 알고리즘 스터디 2주차 시작합니다.. 야호1. 1로 만들기(https://www.acmicpc.net/problem/1463)저는 문제를 읽고 힌트에서 멈칫했습니다. 10은 2로 나누어지는 값인데 왜 2로 안 나누고 9가 된 것인가?..알고 보니 10 -> 5 -> 4 -> 2 -> 1도 가능하지만 연산 횟수가 더 길어서 10 -> 9 -> 3 -> 1로 만드는 것이라네요.#include using namespace std;int wink[1000001];int makeOne(int n) { wink[1] = 0; for (int i = 2; i > n; int result = makeOne(n); cout 어떤 수를 입력하든 1로 만들어야 하는 문제인데 편리한 기능을 가진 다른 .. [2025 1학기 알고리즘 스터디] 이서영 #2주차 *파이썬으로 풀었습니다- 1463: 1로 만들기- 2579: 계단 오르기- 11053: 가장 긴 증가하는 부분 수열 1463: 1로 만들기정수 X에 사용할 수 있는 연산은 다음과 같이 세 가지 이다.X가 3으로 나누어 떨어지면, 3으로 나눈다.X가 2로 나누어 떨어지면, 2로 나눈다.1을 뺀다.정수 N이 주어졌을 때, 위와 같은 연산 세 개를 적절히 사용해서 1을 만들려고 한다. 연산을 사용하는 횟수의 최솟값을 출력하시오. 1. Greedy 3으로 나눌 수만 있다면 무조건 최선이라 생각했습니다.import sysinput = sys.stdin.readlineN = int(input())count = 0while N!=1: if N % 2 != 0 and N % 3 != 0: N-=1.. [2025 1학기 스프링부트 스터디] 장민주 #3주차 섹션4. 스프링 핵심 원리 이해2 - 객체 지향 원리 적용 섹션5. 스프링 컨테이너와 스프링 빈 이렇게 공부를 했습니다.섹션4. 스프링 핵심 원리 이해2 - 객체 지향 원리 적용저번주에 듣고 남은 부분을 마무리했습니다. (7) 좋은 객체 지향 설계의 5가지 원칙의 적용여기서 3가지 SRP, DIP, OCP를 적용했다. ① SRP(단일 책임 원칙): 한 클래스는 하나의 책임만 가져야 한다.- 구현 객체를 생성하고 연결하는 책임은 AppConfig가 담당한다.- 클라이언트 객체는 실행하는 책임만 담당한다. ② DIP(의존관계 역전 원칙): 추상화에 의존해야지, 구체화에 의존하면 안된다. 의존성 주입도 이 원칙을 따른다.- 기존 클라이언트 코드는 구현 클래스에도 함께 의존했었다.- AppConfig가 객체 인.. [2025 1학기 스프링부트 스터디] 남윤찬 #3주차 이번주는 jpa 활용 강의를 시작하였습니다..만… 프로젝트를 만들다가 화딱지가 나서 일단 섹션 1인 프로젝트 환경설정까지 했습니다.프로젝트 생성start.spring.io로 접속하면 매우 쉽게 프로젝트를 만들 수 있다.이렇게 라이브러리를 설정해주고 generate 후 intellij로 프로젝트를 빌드하면 된다.그리고 Preference → plugin으로 가서 lombok을 검색, 실행하여 롬복을 적용시킨다.View 환경설정thymeleaf 라이브러리를 설치했기 때문에 서버사이드 렌더링을 해서 resources 경로에 templates나 static 폴더에 html 파일을 넣고 컨트롤러에서 매핑을 해주게 되면 스프링부트가 html을 반환하게 된다.@GetMapping("hello")public Strin.. [2025 1학기 스프링부트 스터디] 류현준 #2주차 섹션 3. 스프링 웹 개발 기초1) 정적 컨텐츠 정적 컨텐츠는 사용자의 요청이 있을 때 서버가 별도의 처리 없이 그대로 전달하는 고정된 파일을 의미합니다. HTML, CSS, JavaScript, 이미지, 폰트 파일 등이 여기에 해당한다고 합니다. 서버는 이 파일들을 미리 준비해두고 요청이 들어오면 그대로 응답하기 때문에 응답 속도가 빠르고 서버 부하가 적습니다.localhost:8080/hello-static.html을 치고 들어갔지만 갑자기 글씨가 깨져서 당황했지만 " 하나를 잘못 치니 저렇게 나와버렸습니다... 똑디 입력하니 잘 나오는 모습임미다. 웹브라우저에 'localhost:8080/hello-static.html' 을 치면 내장 톰켓서버가 요청을 받고 'localhost:8080/hell.. 이전 1 2 3 4 ··· 31 다음 목록 더보기
