티스토리

SIA's

검색하기

블로그 홈

SIA's

sia-s.tistory.com/m

SI-AH 님의 블로그입니다.

구독자: 0

방명록 방문하기

주요 글 목록

[CS] 클라우드 VS 온프레미스 1. 클라우드(Cloud Computing): 인터넷을 통해 가상화된 컴퓨터의 IT 리소스를 제공하는 것 = CPU, RAM(메모리), 스토리지, 네트워크→ 정보를 자신의 컴퓨터가 아닌 인터넷에 연결된 다른 컴퓨터로 처리하는 기술 1) 사용하는 이유(1)자원 활용성 증가 : 낭비되는 컴퓨팅 자원이 감소(2) 운영 효율성 증가 : 흩어진 자원을 개별로 관리하지 않고, 중앙에 모인 자원을 관리(3) 인공지능(AI) 서비스를 확장 : 클라우드는 기계학습에 필요한 데이터를 쉽게 모을 수 있음 2) 클라우드 컴퓨팅 분류(1) Public Could: 인터넷 접속이 가능한 모든 사용자를 위한 모델(2) Private.. 공감수 0 댓글수 0 2025. 3. 12.
[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-... 공감수 0 댓글수 0 2025. 3. 11.
[CS] 보안 - 암호화, 복호화, 인증서, 해싱 1. 암호화/복호화1) 암호: 정보를 이해할 수 없도록 암호화하거나 다시 해독하기 위한 일련의 단계를 정의한 알고리즘암호문: 암호 알고리즘을 이용하여 평문에 수행한 암호화한 결과 ↔평문: 암호화되지 않은 정보 2) 암호화 종류(1) 단방향 암호화: 암호화 후 복호화 할 수 없음(DB에 비밀번호 저장할 때 사용)(2) 양방향 암호화: 암호화와 복호화 모두 가능(대부분의 정보는 양방향 암호화로 암호화 됨) 3) 대칭키와 비대칭키(1) 대칭키(공통키): 암호화와 복호화에 같은 암호키를 이용정보를 주고 받는 측이 같은 암호를 사용→ 보안적으로 문제가 됨(키 배송 문제)* 키 배송 문제 : 사전에 키를 공유하지 않으면 암호화/복호화 불가능 : 중간에 탈취 당하면 데이터의.. 공감수 0 댓글수 0 2025. 3. 10.
[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.. 공감수 0 댓글수 0 2023. 8. 18.
[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.. 공감수 0 댓글수 0 2023. 8. 17.
[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.. 공감수 0 댓글수 0 2023. 8. 17.
[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값을 받아와서 리스트를 구성하도록 한다. .. 공감수 0 댓글수 0 2023. 8. 16.
[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.. 공감수 0 댓글수 0 2023. 8. 16.
[React] 기초 환경 세팅, 코드 수정, 배포 1. 환경 세팅 VScode에서 리액트 앱을 만들 폴더를 선택하고, 해당 폴더에서 터미널을 열어 npx create-react-app .을 하게 되면, 아래와 같은 내용이 나오고, 리액트 앱을 만들 환경을 세팅할 수 있다. 2. 실행 npm start 를 통해 리액트 앱을 실행하면, 아래와 같은 웹페이지를 볼 수 있다. 3. 코드 수정 위의 과정을 하게 되면 아래와 같은 파일과 소스들이 생성된다. 여기에서 index.js가 입구의 역할을 하기 때문에, 앱을 작동시키면 제일 먼저 이 곳으로 들어오게 된다. 가 웹 페이지의 전체 UI이다.(실제로 이 코드를 지우면, 화면에 아무것도 나오지 않음) 에 해당하는 세부 내용은 네 번째 줄에 import된 내용에서 알 수 있다. 즉, react-app/src/App.. 공감수 0 댓글수 0 2023. 8. 14.
[JavaScript] To-do List 만들기 - 3 (목록의 요소 삭제하기, 체크박스 수정) 하고 싶은 일 1. 할 일을 입력 받음 2. 리스트에 올라감 3. 리스트의 테두리에 박스가 있었으면 좋겠음 4. 리스트의 마커가 체크박스였으면 좋겠음 5. 체크박스가 checked 상태일 때 취소선이 생김 6. 목록에 있는 할일을 삭제할 수 있는 기능이 있었으면 좋겠음 7. html 파일과 js 파일이 나눠졌으면 좋겠음(refactoring) 목록의 요소 삭제하기 [취소선 만들기]에서 썼던 addEventListener()를 사용해서 delItem이라는 함수로 목록의 요소를 삭제할 수 있도록 했다. 1. function.bind(thisArg, arg1, arg2, ···) bind 매서드를 사용하면, 함수의 컨텍스트를 변경하거나, 함수에 초기 인수를 설정하는 등의 작업을 할 수 있다. 여기에서 func.. 공감수 0 댓글수 0 2023. 8. 14.
[JavaScript] To-do List 만들기 - 2 (취소선 만들기) 하고 싶은 일 1. 할 일을 입력 받음 2. 리스트에 올라감 3. 리스트의 테두리에 박스가 있었으면 좋겠음 4. 리스트의 마커가 체크박스였으면 좋겠음 5. 체크박스가 checked 상태일 때 취소선이 생김 6. 목록에 있는 할일을 삭제할 수 있는 기능이 있었으면 좋겠음 7. html 파일과 js 파일이 나눠졌으면 좋겠음(refactoring) 취소선 만들기 체크박스의 상태를 알 수만 있으면 checked 또는 unchecked의 상태에 따라 취소선을 긋거나 지우면 되기 때문에 크게 어려운 일은 아니었다. addEventListener() 을 사용해 체크박스의 체크여부에 따라 취소선을 그릴 수 있도록 만들었다. 1. addEventListener(eventType, callback) 웹 페이지에서 특정 이.. 공감수 0 댓글수 0 2023. 8. 7.
[정보처리기사 실기] 3. 통합구현 공감수 0 댓글수 0 2023. 7. 11.
[정보처리기사 실기] 2. 데이터 입출력 구현 1, 2 공감수 0 댓글수 0 2023. 7. 11.
[정보처리기사 실기] 1. 요구사항 확인 1, 2 공감수 0 댓글수 0 2023. 7. 11.
[JavaScript] To-do List 만들기 - 1 (박스 만들기, list의 marker로 checkbox 사용) 하고 싶은 일 1. 할 일을 입력 받음 2. 리스트에 올라감 3. 리스트의 테두리에 박스가 있었으면 좋겠음 4. 리스트의 마커가 체크박스였으면 좋겠음 5. 체크박스가 checked 상태일 때 취소선이 생김 6. 목록에 있는 할일을 삭제할 수 있는 기능이 있었으면 좋겠음 7. html 파일과 js 파일이 나눠졌으면 좋겠음(refactoring) 아래 코드는 1~4번까지 완료된 코드이다 To-Do List 리스트의 marker를 체크박스로 바꾸는 과정에서 어려움을 겪었는데, 이 문제는 CSS default로 설정되어 있는 disc 형태의 marker를 삭제하고(list { list-style-type: none; }), JS checkbox 요소를 추가해주면 된다. (for문의 createElement) 이.. 공감수 0 댓글수 0 2023. 7. 1.
[JavaScript] 객체와 메소드와 반복문 객체(object): 서로 연관된 함수와 변수를 같은 이름으로 그룹핑해 잘 정리하기 위한 도구 → 함수 위에 존재 매소드(method): 객체에 속해있는 함수 1. 객체 생성 객체는 { }를 이용해 생성한다 Object Create Object 정보를 넣을 때, 정보에 대한 이름을 함께 넣어줘야한다. 위 코드에서는 grogrammer과 designer가 정보에 대한 이름이고, egoing과 leezche가 정보이다. 만약 이미 존재하는 객체에 정보를 추가하고 싶을 땐, 객체.정보에 대한 이름 = 정보 와 같은 형태로 작성해주면 되는데, 정보에 대한 이름에 공백이 포함되어 있다면 배열과 같은 형태로 정보를 추가할 수 있다. 2. 반복문 Object Iterate JavaScript에서의 반복문으로 객체에 .. 공감수 0 댓글수 0 2023. 6. 28.
[JavaScript] 반복문과 함수 반복문으로 모든 a 태그를 찾아 a 태그의 style을 바꿔주었다. 또한, a 태그의 style을 바꿔주는 부분을 함수로 만들어서, 같은 내용을 반복해 사용할 경우에도 코드가 중복되지 않도록 했다. 1. 반복문 WEB hello world CSS JavaScript 자바 스크립트를 활용해 다크모드&라이트 모드 만들기~ 위 코드에서 onclick 안에 있는 코드가 while문을 활용해 모든 a 태그를 찾고, dark모드가 될 경우엔, 글씨 색을 powderblue로, light모드가 될 경우엔, 글씨 색을 blue로 바꾸어 주었다. document.querySelectorAll('a')은 모든 a 태그를 찾아 배열에 담아주는데, 반복문을 통해 배열에 담긴 모든 a 태그의 style을 바꿔줄 수 있다. 2... 공감수 0 댓글수 0 2023. 6. 26.
[JavaScript] button과 이벤트 버튼의 이벤트 속성으로는 무조건 JS가 와야한다. 1. 버튼 만들기 을 사용하면, button을 만들 수 있다. value는 button위에 나타날 글자를 설정해줄 수 있다. 2. onclick 이벤트 onclick 을 사용하면 버튼을 눌렀을 때 일어날 이벤트를 만들어줄 수 있다. 위 코드에서는 버튼을 눌렀을 때, " button clicked! "라는 알림이 뜨도록 했다. onclick 이외에도 onchange, onselect 등 많은 이벤트들이 있다. 3. 나이트 모드와 라이트 모드 구현 나이트 모드와 라이트 모드 onclick 에 document.querySelector('body')는 'body' 태그 내에 적용할 효과라는 의미이고, .style.backgroundColor(또는 color)은 .. 공감수 0 댓글수 0 2023. 6. 25.
[JavaScript] JS vs HTML JavaScript 는 동적이다. → html 위에서 작동하며, 사용자와 상호작용한다. 1. JavaScript를 html 코드에 넣기 JavaScript 1 태그 안에 HTML 1+1 html과 JavaScript의 차이점은 JavaScript는 동적이고, html은 정적이라는 것이다. 공감수 0 댓글수 0 2023. 6. 24.
[백준/Python]14719 빗물 ' 벽과 벽 사이의 빈 공간에는 무조건 빗물이 채워질 수 있다 '는 아이디어로 작성하게 된 코드이다 2차원 세계에 블록이 쌓여있는 것을 표현한 world 라는 2차원 리스트를 만들었고, 한 줄 씩 돌면서 빗물이 채워질 수 있는 공간의 크기를 구했다 H, W = map(int, input().split()) block = [int(i) for i in input().split()] world = [[0] * W for _ in range(H)] for i in range(W): for j in range(block[i]): world[j][i]= 1 answer = 0 for i in range(H): start = False water = 0 for j in range(W): if world[i][j] .. 공감수 0 댓글수 1 2023. 6. 17.
[Programmers/Python] 이모티콘 할인행사 프로그래머스 문제 간단히 생각하기 1. 할인율은 10%, 20%, 30%, 40% 이고, 2. 사용자는 각각 '최소 할인율'과 '최대 구매 가능 금액' 을 가지고 있습니다. 3. 사용자는 이모티콘를 구매하거나, 이모티콘 플러스에 가입할 수 있는데, 4. 3번에 대한 기준은, '최소 할인율' 이상의 할인율을 적용시켜 구매한 이모티콘의 가격이 4-1. '최대 구매 가능 금액' 미만인 경우, 이모티콘 구매하고, 4-2. '최대 구매 가능 금액' 이상인 경우, 이모티콘 플러스 가입 5. 이모티콘 플러스 가입자가 최대인 경우 중, 판매액을 최대로 하는 경우의 이모티콘플러스 가입자수와 판매액을 출력 해야할 일 1. 각 이모티콘에 대해 적용할 할인율의 경우의 수를 구합니다. 2. 각 할인율을.. 공감수 0 댓글수 0 2023. 6. 16.
[Programmers/Python] 신규 아이디 추천 프로그래머스 Lv1.인만큼 어렵지 않은 문제였고, 문제에 주어진 단계를 그대로 구현하면 되는 문제였다. def solution(new_id): answer = '' # 1단계 new_id = new_id.lower() # 2단계 for id in new_id: if id.isalpha() or id.isdigit() or id in '-_.': answer += id # 3단계 while '..' in answer: answer = answer.replace('..', '.') # 4단계 if answer[0] == '.' and len(answer)>1: answer = answer[1:] if answer[-1] == '.': answer = answer[:-1] # 5단계 .. 공감수 0 댓글수 0 2023. 6. 15.
[백준/Python] 1205 등수 구하기 구현은 쉽게 했는데, 계속 틀렸다고 나옴;;; 아직도 뭐가 문제인지 모르겠어서 구글링 했다.... 에휴.........; 그리고 처음에 비오름차순이 내림차순이라는 뜻인지 아님 sorting이 안되어 있다는 뜻인지 헷갈렸다;; n, s, p = map(int, input().split()) if n == 0: print(1) else: scores = [int(i) for i in input().split()] if n == p and scores[-1] >= s: print(-1) else: rank = n + 1 for i in range(n): if scores[i] 공감수 0 댓글수 0 2023. 6. 15.
[백준/Python] 20055 컨베이어 벨트 위의 로봇 ※ 이 풀이법은 PyPy3으로 통과된 방법으로, Python3으로는 '시간 초과'가 뜨는 코드입니다 개인적인 "구현 연습"을 위해 외부 라이브러리 사용 없이 빡구현 한 코드입니다. deque의 rotate를 사용하면 회전하는 컨베이어 벨트를 바로 만들 수 있었겠지만, 구현 연습을 위해 직접 구현했다. 또한 0의 개수를 셀 때도, count 함수를 사용하지 않고 직접 구현했다. 문제에서 주어진 컨베이어 벨트 작동 순서는 크게 3가지로, 1. 회전하고 2. 이동하고 3. 올린다 를 내구도의 0 개수가 K개 이상이 될 때까지 반복 라고 생각할 수 있다. 위의 세 과정을 모두 지나야 한 단계를 지났다고 생각한다. 따라서, 회전 / 이동 / 올림 을 각각 구현하고, 내구도 0의 개수를 세는 과정을 순서대로 구현했.. 공감수 0 댓글수 0 2023. 6. 14.
[백준/Python] 20006 랭킹전 대기열 특별한 알고리즘 없이 써있는 대로 구현하는 문제이다. 고려해야할 부분은 두 가지라고 생각하는데 1. 입력된 순서대로 게임을 시작한다 → for문으로 입력으로 차례로 받아서 바로바로 방에 넣어줘야함 2. 닉네임은 사전 순으로 출력된다 → 마지막에 sorting 해주기 1번 때문에 모든 입력을 한 번에 받은 후 레벨을 기준으로 정렬해 m명 씩 나눠 출력할 수 없다는 뜻이다. 그렇다면 어떻게 문제를 간단히 생각할 수 있을까? 핵심 아이디어는 다음과 같다. 처음 방에 들어간 사람의 레벨과 비교해 -10 공감수 0 댓글수 1 2023. 6. 13.
[백준/Python] 2852 NBA 농구 처음에 생각을 잘못 해서 틀려서 두 번째 시도에서 성공했다. 처음에 생각하지 못한 경우는 팀1이 우세하다가 팀2가 우세하고 다시 팀1이 우세하면서 엎치락 뒤치락할 수 있다는 것을 생각 못했다. 예제에 나와있는 한 팀이 우세한 뒤 다른 한 팀이 우세하면 끝난다고 생각해서 여러번의 '이기는 시간'의 누적을 구할 수 없었다 그래서 작성했던 모든 코드를 지우고 다시 코드를 작성하기 시작했는데, 처음에는 시간을 mm:ss 형태로 계산했던 것이 너무 복잡해서 그냥 다 초로 바꾼 뒤에 마지막에 누적 시간을 다시 주어진 형식(mm:ss)으로 바꿔주었다. 고려해야할 사항은 1) 각 팀의 점수(이기고 있는 팀의 시간을 누적) 2) 팀 각각의 누적시간을 구함 이라고 생각했고, 나는 이 문제를 "지금 어떤 팀이 이기고 있는지.. 공감수 0 댓글수 0 2023. 6. 12.
[백준/Python] 1224 스위치 켜고 끄기 너무 잘 풀었는데 자꾸 '틀렸다'고 나와서 너무 마음이 아팠다.. 대략적인 구현은 쉬워서 한번에 술술 적었는데, 예외 처리 해줘야하는 부분을 못 찾아서 계속 틀림....ㅜ 문제에서 대놓고 말해주지 않는 예외를 찾는 것은 아직 너무 어렵다;ㅅ; (맞았습니다 많은 건, 함수로 풀어보고 싶어서 이것 저것 시도한 흔적입니다,,~) 일단 문제를 간단히 요약하면, 남자 → n 배수 스위치 누르기 여자 → 대칭: 5개 모두 스위치 누르기 → 비대칭: n만 스위치 누르기 이렇게 간단하게 요약할 수 있다. def boy(n): for i in range(1, (N // n) + 1): if switch[(n * i) - 1] == 1: switch[(n * i) - 1] = 0 else: switch[(n * i) - .. 공감수 0 댓글수 0 2023. 6. 10.
[백준/Python] 1138 한 줄로 서기 처음에 생각했던 방법은 처음 나온 0의 인덱스를 제일 처음에 놓고, 그 다시 people을 처음부터 끝까지 돌면서 자기보다 작은 숫자가 몇개 있나 세서, 그 수랑 people에 있는 수가 같은 수의 인덱스를 두번째에 놓고··· 하는 방법이었는데, 뭔소린지 모르시겠죠? 당연함.. 나도 모르겠음ㅠ 암튼 그래서 인덱스랑 자기보다 큰 사람이 왼쪽에 몇명있는지를 dictionary로 해서 해보려고 했어요,, 근데 아무리 생각해도 계속 비교하느라고 for문을 돌면 너무 시간이 오래 걸릴 거 같은 거에요 그래서 막 이진탐색을 해? 그럼 sorting을 해야돼? 이렇게까지? 이러면서 삽질 오지게 하다가 결국 구글링을 했어요^^ 3시간만에^^ 진짜 혼자 풀어보고 싶었는데......^^ㅎ; 대략적인 아이디어는 앞 번호부터.. 공감수 0 댓글수 2 2023. 6. 9.
[백준/Python] 1475 방 번호 처음에 세트를 어떻게 세야할까 생각하는게 어려웠다.. 그냥 한 번에 생각났으면 바로 풀 수 있는 문젠데, 자꾸 어렵게 생각하다보니까 이상한 곳에서 쓸 데 없이 시간을 많이 쓴 기분...ㅠ check = [0] * 10 for i in input(): check[int(i)] += 1 sn = check[6] + check[9] if sn % 2 == 0: check[6], check[9] = sn // 2, sn // 2 else: check[6], check[9] = sn // 2 + 1, sn // 2 + 1 print(max(check)) 풀이과정 1. 0이 10개 있는 check라는 배열을 만들기 2. 방 번호를 하나씩 받아서 해당하는 배열에 +1 ( ex_방번호가 678이라면, check[6],.. 공감수 0 댓글수 0 2023. 6. 7.
[백준/Python] 14503 로봇청소기 전형적인 구현 문제이다. 문제에서 주어진 풀이 과정을 따라가며 풀면 된다. 방의 구조가 주어지고, 특정 위치에서 동서남북을 비교해가며 푸는 문제이므로 BFS를 활용해 구현했다. 반시계 방향으로 돌리는 걸 어떻게 구현해야할지 고민을 많이 했는데, 북(0)->서(3) / 서(3)->남(2) / 남(2)->동(1) / 동(1)->북(0) 임을 고려해 (d+3) % 4라는 식을 만들어냈다. N, M = map(int, input().split()) i, j, d = map(int, input().split()) room = [list(map(int, input().split())) for _ in range(N)] visited = [[0]*M for _ in range(N)] # 1. 현재 칸이 아직 청소되지.. 공감수 0 댓글수 0 2023. 6. 5.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.