분류 전체보기 (60) 썸네일형 리스트형 [CS] 클라우드 VS 온프레미스 1. 클라우드(Cloud Computing): 인터넷을 통해 가상화된 컴퓨터의 IT 리소스를 제공하는 것 = CPU, RAM(메모리), 스토리지, 네트워크→ 정보를 자신의 컴퓨터가 아닌 인터넷에 연결된 다른 컴퓨터로 처리하는 기술 1) 사용하는 이유(1)자원 활용성 증가 : 낭비되는 컴퓨팅 자원이 감소(2) 운영 효율성 증가 : 흩어진 자원을 개별로 관리하지 않고, 중앙에 모인 자원을 관리(3) 인공지능(AI) 서비스를 확장 : 클라우드는 기계학습에 필요한 데이터를 쉽게 모을 수 있음 2) 클라우드 컴퓨팅 분류(1) Public Could: 인터넷 접속이 가능한 모든 사용자를 위한 모델(2) Private.. [CS] 컴퓨터 기초 - OS, Window, Linux, 커널 1. OS(Operating System): 응용 프로그램과 컴퓨터(하드웨어) 사이를 중재 → 양면 플랫폼1) OS의 역할운영체제의 핵심은 자원을 어떻게 효율적으로 관리할 것인가 (1) 프로그램 실행 관리 -. 컴퓨터에서 여러 프로그램을 실행할 때 누가 먼저 실행될지, 얼마나 CPU를 사용할지 조절 (2) 자원관리(메모리/저장소/장치 관리) -. RAM(메모리)을 적절히 나눠주고, 파일 저장을 도와주고, 마우스나 키보드 같은 장치들과 연결 (3) 사용자와 컴퓨터를 연결 -. 마우스나 키보드를 이용해 컴퓨터를 조작할 수 있도록 함 * OS가 없다면, 프로그램을 실행할 때, 컴퓨터의 각 부품들과 0과 1로 직접 대화해야함 2) OS의 종류-. Window-. Unix-. Linux-. Mac OS-... [CS] 보안 - 암호화, 복호화, 인증서, 해싱 1. 암호화/복호화1) 암호: 정보를 이해할 수 없도록 암호화하거나 다시 해독하기 위한 일련의 단계를 정의한 알고리즘암호문: 암호 알고리즘을 이용하여 평문에 수행한 암호화한 결과 ↔평문: 암호화되지 않은 정보 2) 암호화 종류(1) 단방향 암호화: 암호화 후 복호화 할 수 없음(DB에 비밀번호 저장할 때 사용)(2) 양방향 암호화: 암호화와 복호화 모두 가능(대부분의 정보는 양방향 암호화로 암호화 됨) 3) 대칭키와 비대칭키(1) 대칭키(공통키): 암호화와 복호화에 같은 암호키를 이용정보를 주고 받는 측이 같은 암호를 사용→ 보안적으로 문제가 됨(키 배송 문제)* 키 배송 문제 : 사전에 키를 공유하지 않으면 암호화/복호화 불가능 : 중간에 탈취 당하면 데이터의.. [React] Create, Update, Delete 1. Create content = ( { // topics에 id, title, body 추가하기 const newTopic = { id: nextId, title: _title, body: _body }; const newTopics = [...topics]; newTopics.push(newTopic); setTopics(newTopics); setNextId(nextId + 1); }} > ); 배열의 상태를 변경시킬 때는 1) newValue = {...value} → ...을 통해 똑같은 배열을 복사한 newValue를 만든다 2) newValue 변경 → 복사된 배열을 변경시킨다 3) setValue(newValue) → 컴포넌트를 다시 실행시켜 변경된 내용으로 배열을 만든다. 2. Upda.. [React] state 1. Prop과 State Prop과 State는 모두 이 값이 변경되면 새로운 return값을 만들어서 UI를 바꾼다. 이 둘의 차이점은, prop은 컴포넌트를 사용하는 외부자를 위한 데이터 state는 컴포넌트를 만드는 내부자를 위한 데이터 2. state state를 사용하기 위해서는 {useState}를 import해주어야 한다. import { useState } from "react"; useState는 배열로 저장이 되는데, state의 값은 index 0에 저장되어 있고, state를 바꿀 때는 index 1에 있는 함수로 바꾼다. const _mode = useState('WELCOME'); const mode = _mode[0] # state(현재는 'WELCOME'이 저장) const.. [React] 이벤트 1. 이벤트1 - 인자값이 없는 경우 태그 안에 원하는 이벤트를 수행할 함수를 넣어서 사용하면 된다. function( ) 대신 arrow function 문법으로 써도 된다.(보통 이렇게 많이 씀) ## function( ) # Header 컴포넌트 function Header(props) { return ( {props.title} ); } # function App() function App() { return ( ); } ## arrow function # Header 컴포넌트 function Header(props) { return ( { event.preventDefault(); props.onChangeMode(); }} > {props.title} ); } # function App() f.. [React] Props 1. Props props는 데이터를 전달하기 위해 사용한다. 아래의 코드를 보면, {props.title}를 통해 Header 컴포넌트를 사용할 때 title로 주었던 REACT라는 데이터를 전달해주었다. # Header 컴포넌트 function Header(props) { return ( {props.title} ); } # Header 컴포넌트 사용 function App() { return ( ); } 2. Props 활용 topics라는 배열을 만들고, for문을 사용해 배열에 있는 내용들을 리스트로 만들었다. for문에 있는 t는 props.topics[i]으로 각 배열의 요소들을 나타내고, t.id와 t.title은 각 요소에 있는 id값과 title값을 받아와서 리스트를 구성하도록 한다. .. [React] 컴포넌트 만들기(사용자 정의 태그) React = 사용자 정의 태그를 만드는 것 컴포넌트 = 사용자 정의 태그 1. 컴포넌트(=사용자 정의 태그) 만드는 법 태그를 함수로 만들어서, return 값에 태그 내용을 써넣는다. 이 때 컴포넌트는 대문자로 시작해야한다 컴포넌트를 만들어 사용하면, 해당 컴포넌트를 사용하는 모든 곳에 한 번에 수정을 할 수 있게 된다. 2. 사용한 전체 코드 import logo from "./logo.svg"; import "./App.css"; function Header(props) { return ( {props.title} ); } function Nav() { return ( html css js ); } function Article(props) { return ( {props.title} {props.. 이전 1 2 3 4 ··· 8 다음
