Jini Dev

RDBMS (관계형 데이터베이스 시스템) 란?Relational Database Management System서로 관련된 데이터 지점에 대한 접근을 저장 및 제공하는 DB유형이다.데이터를 테이블에 직관적으로 간단하게 나타내는 관계형 모델을 기반으로 한다.테이블의 각 행은 key 라는 고유한 ID가 포함된 레코드이다.테이블의 각 열은 데이터 속성이 들어있으며, 각 레코드에는 일반적으로 각 속성에 대한 값이 있어서 데이터 포인트 간의 관계를 손쉽게 설정할 수 있다.RDB(관계형 데이터베이스) 구조 (논리적 구조 vs 물리적 구조)Relational Database데이터 테이블, 뷰, 인덱스(논리 데이터 구조) ⇒ 물질적인 스토리지 구조와 분리되어있음⇒ DB 관리자는 논리적 구조로 해당 데이터에 대한 접근에..

MySQL 이란?MySQL은 RDBMS(오픈 소스 관계형 데이터베이스 관리 시스템) 이다⇒ 구조화된 데이터를 저장하고 관리하도록 설계된 SQL 기반 관계형 DBSQL(Structured Query Langage) 구조화된 쿼리 언어관계형 DB에서 데이터를 검색, 업데이트, 삭제, 조작하는데 사용되는 프로그래밍 언어이다.MySQL과 SQL의 차이점‘SQL’은 DB를 조작하는데 사용되는 프로그래밍 언어의 일종 (구조화된 쿼리 언어)‘MySQL’은 SQL 언어를 사용하여 DB의 데이터를 관리 및 쿼리 하는 RDBMS⇒ 즉 MySQL RDBMS에 데이터가 저장되어 있는 경우 간단한 SQL 프롬프트를 작성해서 데이터를 추가, 검색, 분석할 수 있다.스키마로 구성된 행렬의 테이블에 데이터를 저장한다.스키마 : 데이..

DataGrip을 새롭게 사용하게 되어 작성한다. 공식사이트 : https://www.jetbrains.com/ko-kr/datagrip/ DataGrip: JetBrains가 만든 데이터베이스 및 SQL용 크로스 플랫폼 IDE www.jetbrains.com데스크탑 다운로드를 받는다.다운로드 링크는 https://www.jetbrains.com/ko-kr/datagrip/download/#section=windows이며, 30일 무료체험이 가능하다. 일단 현재 진행하는 프로젝트가 MySQL 을 DataGrip을 통해 확인? 관리되고 있어서 오늘 설치하긴했는데하나하나 더 공부해야겠다...

오늘 DB를 설명 듣다가 OAuth가 뭐냐고 질문을 받았는데OOS로 잘못들어서 모른다고 했다.. ㅎㅎㅎㅎ.....나중에 알고보니 OAuth였던것.. 사실은 아는거였지만...!! 그래도 개념 정리하기 위해 쓴다!OAuth란? 기존엔 인증방식 표준이 없어서, 기본인증인 아이디와 비밀번호를 사용했었다.기본 인증이 아닌 경우에는 각 애플리케이션에서 각자 개발한 회사의 방법대로 사용자를 확인했는데EX) 구글, Apple, 페이스북, 마이크로소프트, 트위터 등 에서 각자 만들어 놓은 Auth 사용하기=> 위와 같이 제 각각인 Auth 인증 방식을 표준화 한 인증방식이다. 인터넷 사용자들이 비밀번호를 제공하지 않고 다른 웹사이트를 접속할 때 자신들의 정보에 대해 웹사이트나 애플리케이션의 접근 권한을 부여할 수 있는 ..

React : event 기능 적용 (이벤트 연결하기)마우스 이벤트Mouse EventonClick 마우스 버튼 클릭 시 발생하는 이벤트(MouseDown과 MouseUp이 한 세트여야 onClick이 된다)onMouseDown마우스 버튼을 눌렀을 때 발생onMouseUp마우스 버튼을 뗐을 때 발생onMouseEnter요소 밖에서 안으로 마우스 커서가 들어갔을 때 발생onMouseLeave요소 안에서 밖으로 마우스 커서가 나갔을 때 발생onMouseMove요소 안에서 마우스 커서를 움직였을 때 발생 - onClick, onMouseDown, onMouseUp의 이벤트를 모두 등록한 경우onMouseDown > onMouseUp > onClick 순서대로 실행된다.- 위의 상황에서 이벤트를 등록한 해당 요..

이벤트 적용하기1) JSX 문법에서 이벤트 속성명은 카멜 케이스(camelCase)로 작성한다.2) 특정 이벤트 발생 시 적용될 함수를 Props로 넘겨준다. 버튼 // 버튼이 클릭(onClick) 되었을때 handleClick 함수를 실행하도록 적용JSX 문법 관련 링크 참고이벤트 객체 (event)export default function Event() { function handleClick(e) { // e : 이벤트 객체 console.log('버튼1이 클릭되었습니다.', e); } // e.target : 이벤트가 발생한 요소 / e.target.value : 입력된 값 return ( 버튼 );}이벤트(onClick)가 발생 했을때 해당 함수(han..

요구사항카드가 접히고 열리는 것을 구현한다 (아코디언 컴포넌트 구현)카드가 접혔을 땐 제목 우측에 '+' 를 열렸을 땐 '-' 가 표시 되도록 한다기본 스타일 코드와 App.js 는 구현되어있다.// App.js - Accordion 부모 컴포넌트import Accordion from './test/toggle/Accordion';function App() { return ( );}​라이프사이클을 생각해보면서 구현 해보기 :React : Lifecycle(라이프 사이클) - 클래스형 컴포넌트 vs 함수형 컴포넌트 React : Lifecycle(라이프 사이클) - 클래스형 컴포넌트 vs 함수형 컴포넌트React : 클래스형 컴포넌트와 훅의 등장 이유 React : 클래스형 컴..

React : 클래스형 컴포넌트와 훅의 등장 이유 React : 클래스형 컴포넌트와 훅의 등장 이유React : 컴포넌트와 Props, State (+ useState 훅) 화면을 각 요소로 쪼갠 것- 하나의 JSX 를 반환하는 함수 컴포넌트 만들기 - PascalCase를 사용하여 컴포넌트를 만든다.- 컴포넌트는 기본" data-og-host="jini-dev.tjini-dev.tistory.com클래스형 컴포넌트의 lifecycle 1. 마운트(mount) : 컴포넌트가 실행(생성)될 때 construnctor > getDerivedStateFromProps > render > componentDidMount 클래스의 constructor 실행getDerivedStateFromProps 메소드 실행..

React : Hook React : HookReact : 컴포넌트와 Props, State (+ useState 훅) 화면을 각 요소로 쪼갠 것- 하나의 JSX 를 반환하는 함수 컴포넌트 만들기 - PascalCase를 사용하여 컴포넌트를 만든다.- 컴포넌트는 기본" data-og-host="jini-dev.tjini-dev.tistory.comuseCallback 컴포넌트에서 최초 렌더링 시 특정 함수를 기억했다가 리렌더링 할 때 재활용 하는 훅이다.- 메모이제이션 하고 싶은 함수를 콜백 함수로 작성한다.=> 리렌더링이 발생해도 내부의 함수는 여러번 생성하지 않는다.- 의존성 배열(dependency list)의 값에 따라 useCallback 내부 로직의 실행 조건을 적용 할 수 있다. 1. 의존..

React : Hook React : HookReact : 컴포넌트와 Props, State (+ useState 훅) 화면을 각 요소로 쪼갠 것- 하나의 JSX 를 반환하는 함수 컴포넌트 만들기 - PascalCase를 사용하여 컴포넌트를 만든다.- 컴포넌트는 기본" data-og-host="jini-dev.tjini-dev.tistory.comuseEffect 컴포넌트가 렌더링 될 때마다 특정 작업을 실행할 수 있게 해주는 훅이다.- 실행하고 싶은 작업을 콜백 함수로 작성한다.- return 은 clean-up 함수를 필요한 경우 작성한다.- 의존성 배열 (dependency list)의 값에 따라 useEffect 내부 로직의 실행 조건을 적용할 수 있다. 1. 의존성 배열이 없는 경우 : 매 랜..