| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | ||||||
| 2 | 3 | 4 | 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 | 13 | 14 | 15 |
| 16 | 17 | 18 | 19 | 20 | 21 | 22 |
| 23 | 24 | 25 | 26 | 27 | 28 | 29 |
| 30 | 31 |
- API
- restapi
- Java
- 파이썬챌린지
- 파이썬
- 컴퓨터공학과
- GitHub
- 99클럽 #99일지 #코딩테스트 #개발자스터디 #항해 #TIL
- Yarn
- 리액트
- 몽고DB
- web
- prontend
- JSON
- backend
- jsx
- 디지털포렌식
- 프론트엔드
- CSS
- Git
- Python
- #99클럽 #99일지 #코딩테스트 #개발자스터디 #항해 #TIL
- npm
- 보안
- IT
- react
- Today
- Total
목록전체 글 (68)
이것저것
관계형 데이터베이스(Relation DataBase) 관리 시스템(Management System) 이다.관계형 데이터베이스 관리 시스템을 RDBMS(Relation DataBase Management System) 라고 부른다.관계형 데이터베이스는 데이터를 열(Column, Field) 과 행(Row, Record, tuple) 으로 이루어진 테이블(Table, entity, 개체) 형태로 저장한다. ✅ sql 명령어는 대,소문자를 구분하지 않습니다✅ 테이블명도 대,소문자를 구분하지 않습니다✅ 컬럼명도 대,소문자 구분하지 않습니다✅저장되어진 데이터 값 만큼은 반드시 대,소문자를 구분합니다
현재 프로젝트로 사고파(대학 도서관 페이지), 대학생 멘토링 페이지를 다른 기술들을 추가하거나 교체하려고 하는 것을 처음엔 리팩토링 하는 것이다라고 생각을 했었다.이러한 작업이 마이그레이션이었던 것이다. 리팩토링 (Refactoring)소프트웨어의 겉으로 보이는 기능은 바꾸지 않으면서 내부 구조를 개선하여 코드를 더 이해하기 쉽고 수정하기 편하게 만드는 과정- 목적 : 코드의 가독성 향상, 유지보수 비용 절감, 잠재적인 버그 제거- 특징사용자가 느끼는 기능 변화는 전혀 없다결과(Output)는 같지만 과정(Logic)을 깔끔하게 다듬는다.테스트 코드가 뒷받침되어야 안전하게 진행할 수 있다.- 예시 : 중복 코드 제거, 변수 이름 명확하게 바꾸기, 긴 함수를 여러 개로 쪼개기 마이그레이션 (Migrati..
대학생 멘토링 페이지 SRS 작성 중 시스템 아키텍처에 관해서 적어보려고 한다. 시스템 아키텍처 : 시스템 내의 상위 시스템과 하위 시스템들이 어떠한 관계로 상호작용하는지 각각의 동작 원리와 구성을 표현한 것 1. 구성 요소 (Components)상위/하위 시스템 (시스템을 이루는 독립적인 단위들)ex) React, Spring Boot, MariaDB, OpenAPI 2. 관계 및 상호작용(Interactions)"어떠한 관계로 상호작용하는 지"에 해당한다. 데이터가 어떻게 오고 가는지, 어떤 규칙(프로토콜)을 사용하는 지 정의한다.ex) FE와 BE는 REST API(HTTP)로 통신하고, 백엔드와 DB는 JDBC/JPA를 통해 데이터를 주고 받음 3. 동작 원리와 원칙(Principles)각 시스템..
생성된 프로젝트는 테스트 환경에서 Lombok 라이브러리 기능을 활용할 수 없다이 책의 예제에서는 이를 감안해서 System.out.println()을 이용해서 필요한 내용을 출력한다.만일 Lombok을 테스트 환경에도 이용하고 싶다면 build.gradle의 설정에 'testxxxxx'로 시작하는 설정을 추가해야 한다.dependencies {... 생략... testComplieOnly 'org.projectlombok:lombok' testAnnotationProcessor 'org.projectlombok:lombok'}
회원가입을 예로 들자면사용자가 홈페이지에서 아이디, 비밀번호, 주소를 입력한다 ➡️ DTO에 담김주소(서울시, 강남구)는 바뀌지 않는 고유한값이다 ➡️ VO로 관리이 정보를 데이터 베이스에 저장해야한다 ➡️ DAO로 관리 DAO(Data Access Object)데이터베이스에 접근하여 실제 데이터를 조회(SELECT), 삽입(INSERT), 수정(UPDATE), 삭제(DELETE) 하는 역할을 전담하는 객체이다. ✔️ 핵심 역할- 서비스(Service)나 비즈니스 로직에서 SQL이나 DB 연결 로직을 분리해 숨겨준다.- 특정 엔터티(회원, 주문 등)에 대해 DB CRUD 기능을 모아둔 전담 객체 역할을 한다.- DB 접속, 커넥션 관리, SQL 실행, 결과 매핑 등 데이터 접근 관련 코드를 한 곳에 ..
➡️ React 애플리케이션 내에서 페이지 이동할 때는 컴포넌트를 사용한다. 게시판 ▶️ 컴포넌트는 React Router DOM 라이브러리에서 제공하는 요소이다. 는 일반적인 태그와 비슷해보이지만, 페이지 전체를 새로고침하지 않고 URL만 변경하여 클라이언트 사이드 라우팅을 수행한다.to 속성 : 사용자가 이 링크를 클릭했을 때 이동할 애플리케이션의 내부 경로(URL)를 지정한다. 대신 다른 것을 쓰는 경우 태그 : 외부 웹사이트로 이동하거나 페이지 전체를 강제로 새로고침해야 할 때만 일반 태그를 사용한다.Map 함수 : 버튼 클릭이나 로그아웃 성공 같은 특정 로직이나 이벤트 후에 코드로 페이지 이동을 실행해야할 때(Map('/logi..
✅ Propsprops(속성)은 React에서 데이터를 부모 컴퍼넌트에서 자식 컴포넌트로 전달 하는데 사용되는 메커니즘이다.컴포넌트를 레고 블록에 비유한다면 Props는 블록의 색상, 크기, 그리고 조립 방식을 결정하는 지침과 같다. ▶️ Props의 특징1. 단방향 흐름 : Props는 부모 → 자식 방향으로만 전달될 수 있다. 자식 컴포넌트는 전달 받은 Props를 직접 수정할 수 없다 (읽기 전용)2. 데이터 전달 : 문자열, 숫자, 배열, 객체는 물론 함수까지도 Props로 전달 할 수 있다.3. 외부 설정 : 컴포넌트를 사용할 때 외부에서 값을 설정하는 역할을 한다. ✅ fetch: 웹 브라우저의 Node.js 환경에서 네트워크 요청(Request)을 보내고 응답(Response)을 받는 데 사..
Layouts.jsx 설정을 완료했다면 Outlet 자리에 들어갈 컴포넌트들, 즉 실제 컨텐츠 화면들을 만든다.페이지 이동에도 변하지 않는 뼈대를 구성하는 컴포넌트들의 내용을 완성해야 한다..구현할 때 Navbar.jsx가 header 역할을 대체하였기에 header.jsx 파일은 작성하지 않았다. 각 컴포넌트 별로 return 문 안에 요소를 배치하는 순서는 html과 동일하게 첫 번째 요소부터 그려진다.그리고 컴포넌트를 보면 구현해야할 것들이 보인다. return 문 안에 fragment()를 사용하는 이유는 JSX 규칙 때문이다.JSX 문법에서 모든 컴포넌트의 return문은 반드시 하나의 최상위 요소(Root Element)를 반환해야 한다. Fragment는 내부의 여러 요소들을 하나의 최상위..