본문 바로가기

코딩

백준 9498번 Java 문제 시험 점수를 입력받아 90 ~ 100점은 A, 80 ~ 89점은 B, 70 ~ 79점은 C, 60 ~ 69점은 D, 나머지 점수는 F를 출력하는 프로그램을 작성하시오. 입력 첫째 줄에 시험 점수가 주어진다. 시험 점수는 0보다 크거나 같고, 100보다 작거나 같은 정수이다. 출력 시험 성적을 출력한다. 예제 입력 1 100 예제 출력 1 A import java.util.Scanner; public class Main { public static void main(String[] args) { Scanner sc = new Scanner(System.in); int i = sc.nextInt(); if(i >= 90) { System.out.println("A"); } else if(i >= 80).. 더보기
react Hook함수(2) UseRef, useMemo, useCallback - js에서 getElementById, querySelector와 같은 DOM SELECTOR 함수처럼 - React에서 DOM에 접근하게 되는 일이 생긴다면 접근하게 해주는 Hooks 함수 - ref 객체 내부의 값은 render와 상관없이 유지된다(리랜더링 하지 않는다) onClick이라는 속성의 태그 내에 "=" 표시가 있으면 무조건 속성은 속성값입니다 값에 대한 함수를 넣어줍니다 - Memo는 Memoization이며 기존에 수행한 연산의 결과값을 저장했다가 같은 입력이 오면 재활용하는 프로그래밍 기법입니다 - 연산된 값(결과)를 반환하여 랜더링 되었을 때 재사용할 수 있도록 해주는 Hooks 함수 - 컴포넌트의 성능을 최적화 시킬 수 있습니다 useM.. 더보기
DBMS시작 데이터베이스를 하기 위한 프로그램의 종류는 다양한데 대표적인 프로그램으론 Oracle, SQL Server, MySQL 8+, 등이 있습니다 데이터베이스 프로그램의 종류로 저는 MySQL 8+을 선택했습니다 데이터베이스(Database)란? 여러사람이 같이 공유하여 사용할 목적으로, 통합하여 관리되는 저장된 형태의 데이터의 집합입니다 자료 항목의 중복을 없애고 자료를 구조화해 저장함으로써 자료 검색과 갱신 등 운영의 효율을 높인 데이터의 집합 일상에서 사용하는 모든 정보들이 데이터베이스를 통해 열람되고 사용하고 삭제하게 됩니다 ex) 채팅목록, 게시판글 작성, 은행거래 등.. DBMS(database Management System) 사용자 와 데이터베이스(DB) 사이에서 사용자의 요구(query)에 따.. 더보기
react Hook함수(1) State(2) if문 만큼 많이 사용되는 것들이 - map - find - filter 가 있습니다 백엔드를 받아오는 데이터의 형식은 대부분이 배열인 경우가 많습니다. 따라서 이러한 배열들을 화면에 보여주기 위해 사용하는 함수들입니다. (그래서 배열일 경우에만 사용이 가능하다) 1. map [반복문, 한줄 씩 읽어오는 것] => 주로 배열의 길이만큼 반복할 때 사용 ex) 배열명.map((결과값 변수명) => ( 실행문 )) ex) 실행문의 경우 state.map((item) => console.log(item.id)) (id만 넣었으므로 name은 안오고 id값 1,2,3 만 들어온다) ex) HTML 반복의 경우 state.map((item) = ( )) (백엔드의 데이터를 가져올때 데이터가 배열로 오기 때문에 데.. 더보기
react Hook함수(1) State(1) Hook함수란? react에서 상태 변경, 즉 가상돔의 상태를 변경할 수 있는 함수이며 그에 따른 생명 주기를 통해 다양한 이벤트를 실행할 수 있는 함수입니다 react의 초기 상태는 Class형 컴포넌트를 사용했었습니다 지금의 컴포넌트가 const 컴포넌트명 = () => { ... } 이라면, 옛날의 컴포넌트는 Class 컴포넌트명 extends Components { ... } 이런 방식이였습니다 이 클래스 컴포넌트에는 라이프 사이클이라는게 있었는데 이 생명주기(라이플사이클)는 페이지가 처음 열렸을 때부터 닫혔을 때까지 사이에 일어나는 이벤트나 값 변경 등을 관리합니다 Class는 다양한 기능을 상용할 수 있으나 기계와 사용자들을 혼동시킵니다 숙련된 React 개발자조차도 Class를 통한 Reac.. 더보기
react 삼항연산자, props, 비구조화 할당 조건부 랜더링 방식에 사용되며 조건에 충족할 경우 해당 부분을 리랜더합니다 - 식 - { 조건식 ? true인 경우 : false인 경우 } {조건식 && true 인 경우} = {조건식 ? true인경우 : null} {}, [] => 값이 있는걸로 쳐져요 따라서 배열일 때는 {조건식.length > 0 && true인 경우} 상위 컴포넌트(부모컴포넌트)의 값을 하위 컴포넌트에 전달할 변수를 칭하는 말입니다 구조분해할당이라고도 하며 배열이나 객체의 속성을 해제하여 그 값을 개별 변수에 담을 수 있도록 사용하는 JavaScript 표현식이며, 객체의 키값을 찾아오는 것입니다 vscode에서는 저번 강의와 마찬가지로 파일 정리와 기본 설정을 합니다 .. 더보기
react 컴포넌트 react 의 핵심은 re-render(리랜더) 와 Components(컴포넌트)입니다 한가지 이상의 기능을 수행하는 UI 단위 기존에 있던 html을 쪼갠 느낌입니다. html을 통으로 다 작성하면 보기도 힘들고 작성할 때 불편함이 있어 여러 컴포넌트로 나누어 작성하는 것입니다 업데이트 이전의 가상 돔트리와 업데이트 이후 가상 돔트리 상태를 비교하여 업데이트 된 내용이 있다면 컴포넌트를 사용자의 화면에 구성할 때 사용합니다 사용자 화면을 구성할 때 사용하는 render 함수를 다시 호출하는 것이 Re-render(리랜더)입니다 컴포넌트는 말그대로 부분부분 따로 작업해 붙이는 느낌인데 이렇게 div 구조가 있다 하면 헤더는 헤더 컴포.. 더보기
react 기본 이론 이전 글에서 리액트 라이브러리의 기본 설정들을 간단하게 해봤습니다 이번 글에선 설정을 완료하여 웹브라우저를 잘 실행시켜보겠습니다 먼저 React의 기본 주소와 포트는 localhost:3000 입니다 localhost는 본인의 IP주소이며, 3000은 127.0.0.1:3000 입니다 주소는 변경도 가능하여 밑에서 설명하겠습니다 npm i란? node_modules가 없는 상태로 전달되며 git에 있는 클론을 받아도 같은 형태입니다 이런 형태의 파일은 package.json이라는 파일이 있으며 리액트의 모든 기능을 총괄하는 역할을 하는 파일입니다 package.json의 코드입니다 위에서부터 이 폴더의 이름과 버전, 등등이 작성되있고 dependencies라는 코드는 의존성을 부여한 것으로 node.js.. 더보기