전체 글

개발, 알고리즘, 컴퓨터 사이언스 공부한 내용 기록합니다 😆
운영체제

혼자 공부하는 컴퓨터구조 + 운영체제 10장 정리

10-1 프로세스 개요 프로세스란? 실행 중인 프로그램 ‘프로세스를 생성한다’는 것은? 보조기억장치 → 메모리 → 실행 ex. hwp.exe 파일은 프로세스가 아님 → hwp.exe 프로그램을 더블클릭해 실행하면 프로세스가 되는 것 포그라운드 프로세스 vs 백그라운드 프로세스 📌 포그라운드 프로세스(foreground process)란? 사용자와 직접 상호 작용하는 프로세스 📌 백그라운드 프로세스(background process)란? 사용자와 직접 상호 작용하지 않는 프로세스 📌 데몬 프로세스(demon process) 사용자와의 상호작용 없이 정해진 일만 수행하는 백그라운드 프로세스 윈도우 운영체제에서는 서비스(service)라고 부름 PCB(Process Control Block)란? 프로세스와 관..

운영체제

혼자 공부하는 컴퓨터구조 + 운영체제 8장 정리

08-1 장치 컨트롤러와 장치 드라이버 ❓ 입출력 장치가 컴퓨터와 연결될 때 발생할 수 있는 어려움에는 어떤 것들이 있을까? 입출력 장치는 종류가 너무 다양하기 때문에 정보를 주고받는 방식을 규격화하기가 어려움 일반적으로 CPU와 메모리의 데이터 전송률은 높지만 입출력장치의 데이터 전송률은 낮기 때문에 서로 통신을 하기가 어려움 💡 이러한 문제들을 해결하기 위해 등장한 것이 바로 **장치 컨트롤러** 장치 컨트롤러 : 컴퓨터 내부와 입출력 장치를 연결하는 하드웨어 장치 컨트롤러의 역할 CPU와 입출력장치 간의 통신 중개 오류 검출 데이터 버퍼링 📌 버퍼링 전송률이 높은 장치와 낮은 장치 사이에 주고받는 데이터를 버퍼(buffer)라는 임시 저장 공간에 저장해 전송률을 비슷하게 맞추는 방법 💡 장치 컨트롤..

프론트엔드

[우아한 타입스크립트 with 리액트 1장]

1.1 웹 개발의 역사 1. 자바스크립트의 탄생 1990년대 - 마이크로소프트의 인터넷 익스플로러 vs 넷스케이프 커뮤니케이션즈의 넷스케이프 내비게이터 1995년 - 넷스케이프의 브랜든 아이크가 자바스크립트를 만듦 JavaScript 넷스케이프의 브랜든 아이크가 만듦 C, Java와 유사한 기본 문법을 가짐 객체 지향 언어인 셀프(Self)의 프로토타입 기반 상속 개념과 Lisp 계열 언어 중 하나인 스킴(Scheme)의 일급 함수 개념을 차용한 경량의 프로그램이 언어 브랜든 아이크는 자바스크립트를 빠르게 시장의 반응을 확인할 수 있는 프로토타입 언어로 출시함(10일 만에 개발) 인터넷 익스플로러도 자바스크립트에 대항하기 위해 Jscript를 만듦 Jscript 자바 파생 언어 ⇒ 당시에는 자바스크립트와..

Tailwind CSS를 사용해서 동적으로 스타일링 하기

개요 이번 프로젝트에서 드래그앤드랍 기능을 구현하기위해 간단한 실습을 하던 중 동적으로 스타일을 추가하는 부분에서 문제가 생겼다. 드래그앤드랍 기능을 구현하기 위해서는 드롭 시점에 뷰포트 안에서 드래그한 요소의 상대적인 위치를 계산해서 position 속성의 값으로 추가해줘야 하는데 동적으로 생성한 클래스가 tailwind css에서는 적용되지 않았기 때문이다. 다음은 동적으로 CSS 클래스를 추가했던 코드이다. const onDrop = (event: React.DragEvent) => { event.preventDefault() const data = event.dataTransfer.getData('text/plain') const { id, offsetX, offsetY } = JSON.parse..

React

[React] React Router v6

Next.js, Svelte Kit 등의 프레임워크는 폴더 구조를 기반으로 하는 라우팅을 제공한다. 하지만, React는 라이브러리에서는 공식적으로 라우팅 기능을 지원하지 않아 별도의 라우팅 라이브러리를 사용해야한다. 그 중 가장 많이 사용되는 것이 바로 React Router 라이브러리이다. 그렇다면 라우팅이란 정확히 무엇이고, React Router 라이브러리는 어떻게 사용하는 것인지 알아보도록 하자. 이 글은 React Router v6를 기준으로 작성되었다. 1. 라우팅(Rounting)이란? 라우팅을 이해하기 위해서는 먼저 과거에는 웹이 어떻게 동작했었는지를 알아야 한다. 초창기의 웹은 MPA(Multi Page Application) 방식으로 동작했었다. MPA 방식은 웹 애플리케이션이 여러 ..

Git & GitHub

[GitHub] GitHub Actions로 스터디자료 관리하기

DBMS(Dev-Books-Master-Study) 라는 기술 책 스터디를 시작하게 됐는데 Github로 스터디 자료를 관리해야한다는 규칙이 있어서 이에 관련된 내용을 정리해보려고 한다. 스터디에서 발표 자료 관리를 맡아서 하게 됐는데, 깃허브로 자료를 관리하는 게 처음이라 스터디 총책임자가 사용하시는 방식을 여쭤봐서 그대로 적용했다.🫠 알려주신 방법대로만 하면 될 줄 알았는데, GitHub에 대해 내가 모르고 있는 부분이 많아서 그런지 당황한 적이 많았다. 최근에 책 한 권이 끝났는데 두 번째 스터디부터는 같은 실수를 하지 않도록 첫 번째 스터디에서 했던 자료 관리 방법과 실수들을 정리해두려고 한다. 자료 관리 방식은 GitHub Actions를 사용해 Pull request로 올린 자료들을 정해진 시..

Trouble Shooting

[React] Vite 프로젝트에서 ReactDOM.render Warning

Remember Plus 프로젝트를 진행하던 중 콘솔창에서 다음과 같은 warning 이 발생했다. vite를 이용한 프로젝트가 처음이라 warning을 해결한 과정을 정리해보려고 한다. warning message react-dom.development.js:86 Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17. Learn more: warning이 발생한 코드 //main.tsx import ReactDOM from 'react-dom'; import '..

딥러닝

[딥러닝] CNN(Convolution Neural Network, 합성곱 신경망)

CNN이란? CNN은 주로 이미지 처리에 사용되는 딥러닝 모델로, 최근에는 자연어 처리 분야에서도 사용되며 다양한 분야에서 활용되고 있습니다. CNN의 구조 1. Input Layer 2. Convolution Layer 3. Pooling Layer => 특징을 추출하는 부분 4. Flatten Layer => 다차원 배열(이미지 등)을 1차원 벡터로 변환하는 부분 5. Fully Connected Layer 6. Output Layer => 분류를 위한 부분 보통 CNN은 Input Layer 의 위에 Convolution Layer, Pooling Layer가 여러 겹 쌓여있는 특징 추출 부분과 Fully Connected Layer의 입력으로 집어넣기 위해 1차원 벡터로 변환해주는 Flatten ..

sweetrain_owo
단비의 개발노트