전체 글 109

[운영체제] 운영체제 개념 정리

1. 운영체제란? 운영체제(Operating System) 컴퓨터 하드웨어 바로 위에 설치되어 사용자 및 다른 모든 소프트웨어와 하드웨어를 연결하는 소프트웨어 계층 협의의 운영체제(커널) - 운영체제의 핵심 부분으로 메모리에 상주하는 부분 광의의 운영체제 - 커널뿐 아니라 각종 주변 시스템 유틸리티를 포함한 개념 2. 운영체제의 목적 1) 하드웨어, 자원을 효율적으로 관리하기 위함 a.프로세서, 기억장치, 입출력 장치 등의 효율적 관리 - 사용자간의 형평성 있는 자원분배 - 주어진 자원으로 최대한의 성능을 내도록 함 b. 사용자 및 운영체제 자신의 보호 c. 프로세스, 파일, 메시지 등을 관리 2) 사용자에게 컴퓨터 시스템을 편리하게 사용할 수 있는 환경을 제공 a. 운영체제는 동시 사용자/프로그램들이 ..

CS 지식 2023.08.17

[aws] React, Node.js 프로젝트 aws EC2에 배포하기 (Nginx 사용)

React, Node.js, MongoDB로 만든 프로젝트를 포트폴리오용으로 제출하고 싶어서 베포를 해보았다. 배포하는 방법에는 여러 가지가 있지만 나는 포트폴리오용이었기 때문에 무료로 사용할 수 있으면서 대중적으로 가장 많이 사용하는 aws에 배포를 해보기로 하였다. 1. aws 회원가입을 하고 EC2 인스턴스를 생성한다. EC2는 aws에서 제공하는 클라우드 컴퓨팅 서비스이다. 즉, 내가 만든 프로젝트를 항상 가동하고있는 클라우드 컴퓨터에서 실행하고 사람들이 볼 수 있도록 해준다. EC2의 장점은 인스턴스를 생성하여 운영체제, 소프트웨어 등을 자유롭게 선택할 수 있고, 메모리, CPU, 스토리지, 부팅 파티션 크기 등을 선택할 수 있다는 점이다. 1) 서울의 가상컴퓨팅을 사용하기 위하여 헤더 부분의 ..

프로그래밍/AWS 2023.04.20

[Node.js, TypeScript] ES Moudles 사용 시 import 문 확장자 제거하여 사용 하는 방법

- Ndoe.js는 기본적을 Common.js를 사용하여 문서를 불러올 때 require("")를 사용해야 하지만 ES Moudle로 전환하면 개발자들에게 익숙한 import를 사용할 수 있다. - 하지만, Esmoudle을 사용할 때, 모듈 내부에 있는 파일을 import 하고 싶다면 확장자를 mjs 붙여주거나 package.json에서 type:moudle을 입력해 주고 확장자에 js를 붙여줘야 한다. - 이런 번거로움을 해결하기 위한 방법을 포스팅한다. 1. node-modules는 컴파일하지 않을 것이기 때문에 제외를 해준다. //tsconfig.json { "compilerOptions": { "target": "esnext", "module": "esnext", "outDir": "./dist..

[React] web3.js React-Create-App 사용시 sourcemap 오류

React-Create-App로 프로젝트를 만들고 web3.js 라이브러리를 사용하려고 하는 도중 npm start 시 sourcemap 오류가 발생했다. failed to parse source map: 'webpack:///../../src.ts/coders/abstract-coder.ts' url is not supported 소스 맵(Source Map)이란 배포용으로 빌드한 파일과 원본 파일을 서로 연결시켜 주는 기능을 한다. 배포를 할 때 성능 최적화를 위해 HTML, CSS, JS와 같은 웹 자원들을 압축한다. 이때 배포한 파일에서 에러가 난다면 Sorce Map을 통해 원본과 비교하며 디버깅을 할 수 있는 유용한 기능이다. 하지만 소스맵을 사용하는데 단점이 있다. 1. 소스맵을 사용하면 개..

[truffle] Error: VM Exception while processing transaction: revert -- Reason given: Panic: Arithmetic overflow.

Dapp 개발을 위한 테스트를 하는 도 중 다음과 같은 오류가 발생하였다. 구글링 해보니 산술연산을 한 결괏값이 타입의 허용 범위를 넘어서 overflow 됐다고 알려주는 것 같았다. Solidity에서 고정 크기 정수에 대한 산술 연산은 연산 결과가 데이터 유형으로 나타낼 수 있는 최댓값 또는 최솟값을 초과할 경우 Overflow 또는 Underflow 오류가 발생할 수 있는데. Overflow는 최댓값을 초과한 경우, Underflow는 최솟값을 초과할 경우 나타난다. 그래서 컨트랙트 함수내의 산술연산하는 부분을 살펴보았고 다음과 같이 오입력 된 연산을 발견할 수 있었다. mapping(address => mapping(address => uint256)) public allowance; functi..

[truffle] truffle migration 오류(TypeError: Cannot read properties of undefined (reading 'call') at lastCompletedMigration)

Dapp을 만들기 위한 학습을 하던 중 truffle migration을 사용하려고 하자 오류가 발생하였다. 1. Node.js 버전 변경 시도 처음엔 관련 오류가 난 곳의 문서들이 node_modules와 관련되어 있어서, node의 버전이 문제인가 싶어서 stack-over flow의 글을 참고하여 node의 버전을 최신 LTS버전으로 바꾸어주었다. https://stackoverflow.com/questions/71081725/this-version-of-%C2%B5ws-is-not-compatible-with-your-node-js-bu ild-error-node-loade This version of µWS is not compatible with your Node.js build: Error:..

[React] Error Boundary를 사용한 에러처리 (react-query)

ErrorBoundary는 렌더링 과정 중 문제가 생겨서 화면에 빈페이지를 렌더링 할 때 이를 대체하는 UI를 렌더링 해주는 React16부터 도입된 에러처리 기술이다. Error Boundary 공식문서 https://ko.reactjs.org/docs/error-boundaries.html 에러 경계(Error Boundaries) – React A JavaScript library for building user interfaces ko.reactjs.org ErrorBoundary 컴포넌트를 만들고 전역 또는 필요한 부분에 컴포넌트를 사용하면 하위 컴포넌트 트리의 어디에서든 자바스크립트 에러를 기록하며 깨진 컴포넌트 트리 대신 폴백 UI를 보여 줄 수 있다. 또한 렌더링 도중 생명주기 메서드 및 ..

카테고리 없음 2023.02.12

[TypeScript && React ] 리펙토링(1) - TodoList

프론트엔드 온보딩에 참여하게 되었는데, 사전과제로 TodoList 만들기를 했었다. 공고를 늦게 발견하여 시간에 쫓겨 황급히 만들었는데.. 그러다 보니 더럽고 난잡하게 만들어지고 필요 구현 사항들도 완전히 만들지 못하게 되었다. 그렇게 완전하지 못한 사전과제를 기반으로 수업을 들었는데... 멘토님의 지적사항 하나하나가 뜨끔하게 만들었고 코드를 잘 짜는 방법을 배울 수 있게 되어서 좋았다. 아직 실무 경험이 없어 몰랐던 것들을 배울 수 있을 것으로 기대된다. 나는 내용과 적용하는 게 어렵게 느껴졌지만 시간이 오래 걸리더라도 꼭 Todolist를 Best Practice로 만들기 위해 차근차근 리펙토링 해볼 예정이다. 1. Token과 Authorication의 상수 선언 - 회원가입을 통해 발급 받을 수 ..

[JavaScript] Uncaught RangeError: Maximum call stack size exceeded

React로 customhook을 만들고 2개의 customhook이 동작하면서 서로 호출되도록 했는데 다음과 같은 오류가 발생하였다. Uncaught RangeError: Maximum call stack size exceeded 각각의 함수가 서로를 호출하도록 입력하면 무한하게 함수가 서로가 서로를 호출해서 호출 스택(call stack)이 터져서 생긴 에러다.

[TypeScript] type과 interface의 차이

1. 서론 TypeScript에서는 타입을 지정하는 방식인 type과 interface, 이렇게 2가지 방법이 있다. 2가지 방법은 어떤 차이가 있고 떠 어떤 것을 사용해야 하는지 알아보자. 2. type과 inteface의 공통점 일반적인 사용법은 비슷하다. 하지만 인터페이스는 객체에서만 사용이 가능하다는 점을 볼 수 있다. 또한 두 방법은 인덱스시그니쳐, 함수 타입, 제내릭, 확장이 가능하다. 1) 사용방법 // 타입선언 type NumberType = { x: number; y: number; } // 인터페이스 선언 interface NumberInterface { x: number; y: number; } const object1: NumberType = { x: 10, y: 5, } const..