분류 전체보기 86

[Project/ReactTS] 재사용되는 게시판 레이아웃 내 컨텐츠를 페이지별로 다르게 나타내기⚒️

리뉴얼될 총학생회 사이트는 회칙, 공지, 청원 페이지 등의 게시판 글 목록을 같은 레이아웃으로 Infinite Scroll하여 나타낸다. 이 페이지들은 레이아웃은 같아도 목록을 구성하는 컨텐츠가 각각 다르기 때문에 이를 어떻게 구현할지 고민하게 되었다.예전 같았으면 새로운 페이지를 작성할 때마다 기존 레이아웃의 코드를 복사 붙여넣기하여 몇몇 부분을 수정하였겠지만, 이번 프로젝트에서는 Atomic Pattern을 도입하기로 하여 개선해보기로 하였다!또한 이전 총학생회 사이트에서는 페이지마다 중복되는 함수들(axios(),useState()...)이 많아 수정사항이 있으면 페이지별마다 모두 바꿔야 했던 게 불편해서 이 점을 꼭 고치고 싶었다.그래서 이번에는 마음 먹고 새로운 페이지를 작성할 때 기존 레이아웃..

[CS/운영체제] 운영체제란?

운영체제 컴퓨터의 하드웨어를 관리하는 소프트웨어 응용프로그램들의 기반을 제공하고 컴퓨터 사용자와 컴퓨터 하드웨어 사이의 중개 역할을 함 사물 인터넷 장치를 포함하는 차와 가전제품에서부터 스마트폰, 개인용 컴퓨터, 기업 컴퓨터, 클라우드 컴퓨팅까지 어디에나 존재 현대의 컴퓨팅 환경에서 운영체제의 역할을 탐구하기 위해서는 먼저 컴퓨터 하드웨어의 조직과 구조를 이해하는 것이 중요함 여기에는 CPU, 메모리, I/O 장치 뿐만 아니라 저장소도 포함 운영 체제의 기본적인 책임은 이러한 자원을 프로그램에 할당하는 것 운영체제 역할 컴퓨터 시스템 관점 (1) 하드웨어 : 컴퓨터의 기본적인 컴퓨팅 자원을 제공함 CPU (Central Processing Unit) 메모리 I/O 장치 운영체제 하드웨어를 제어 다양한 사..

CS/운영체제 2024.01.03

[eclipse/오류해결] Version 1.8.0_261 of the JVM is not suitable for this product. Version: 17 or greater is required.

Eclipse를 실행하려는데 이런 오류창이 떴다. 구글링 해본 결과, eclipse가 설치된 폴더에 있는 구성 설정 (ini) 파일을 열고 가장 위에 이 두줄을 추가해주면 된다. -vm C:\Program Files\jdk-18.0.2\bin\javaw.exe 위 경로는 사용자마다 다르니 수정이 필요할 듯하다. 아래와 같이 수정해주고 저장하니 정상적으로 실행되었다. -vm C:\Program Files\jdk-18.0.2\bin\javaw.exe -startup plugins/org.eclipse.equinox.launcher_1.6.400.v20210924-0641.jar --launcher.library C:\Users\gaeun\.p2\pool\plugins\org.eclipse.equinox.la..

Java 2023.02.16

Node.js 설치

Node.js 설치https://nodejs.org/en/왼쪽에 LTS로 다운받아서 설치한다 Node.js Setup 설치시 위 부분은 추후에 필요할 때 설치하면 되므로 체크하지 않아도 된다이 부분을 제외한 나머지 부분들은 모두 Next를 눌러주면 된다 설치 확인Window + R을 누르고 cmd에 들어간 후 node -v를 쳤을 때 아래와 같이 설치한 버젼이 알맞게 뜨면 설치 완료이다 js 파일 실행실행하려는 js 파일의 경로로 이동한다 cd 경로그리고 node 파일명.js를 입력하면 된다

JavaScript 2022.12.28

[TypeScript] TIL #01

타입스크립트의 목적 런타임에러를 방지하기 위해, 코드를 실행하기 전에 에러를 잡아내기 위해 사용함 타입스크립트 = Stronly Typed Programming Language 그러나 브라우저는 타입스크립트가 아닌 자바스크립트를 이해하기 떄문에 자바스크립트로 코드를 변환해줘야 함 참고로 Node.js 는 JS와 TS 모두 이해할 수 있음 일단 타입스크립트 코드를 작성해서 그 코드를 컴파일하면 보호장치 없는 자바스크립트가 되지만, 만약 타입스크립트 코드에 에러가 있으면 그 코드는 자바스크립트 코드로 컴파일되지 않음 이런 보호 장치는 유저가 코드를 실행하는 런타임에 발생하는 것이 아님 자바스크립트는 타입 추론을 하기 떄문에 문제가 됨 #2.1 Implicit Types vs Explicit Types (06..

JavaScript 2022.11.16

[ReactJS] 리액트 200제 _ ex013 ~ 015 ( 화살표 함수, forEach(), map() )

013 화살표 함수 사용하기 화살표 함수 function 대신 =>을 사용하며 retrun 문자열을 생략할 수 있음 ES6에서 등장함 콜백 함수에서 this를 bind 해야 하는 문제도 발생하지 않음 콜백함수 : 다른 코드의 인수로서 넘겨주는 실행 가능한 코드 this : 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 식별자 this는 함수가 호출되는 방식에 따라 동적으로 결정됨 this 바인딩 : this를 고정시키는 것 참고 문서 https://kamang-it.tistory.com/entry/JavaScript07this-this바인드편bindcallapply import React, { Component } from "react"; class R013_ArrowFunction..

[ReactJS] 리액트 200제 _ ex009 ~ 012 (문자열, 변수, 전개연산자, 클래스)

009 템플릿 문자열 사용하기 ES (ECMA Script) 는 표준화된 스크립트 언어이고, 그 뒤에 붙는 숫자는 버전을 의미한다 2011년부터 ES5가 웹 표준처럼 사용되고 있고, 2015년 발행된 ES6는 자바스크립트가 따르는 기술 규격이다 React도 ES6의 모든 기능을 사용할 수 있다 `hello ${변수명} world` 문자열과 함수 합치기 위해서 백틱과 ${ }를 사용한다 startsWith() 변수 앞에서부터 일치하는 문자열이 있는지 찾는다 endsWith() 변수 뒤에서부터 일치하는 문자열이 있는지 찾는다 includes() 위치에 상관없이 변수에 특정 문자열이 포함돼 있는지 판단한다 return 값 자료형 = Boolean 010 var, let, const 사용하기 var : (ES5..

[ReactJS] 리액트 200제 _ ex006 ~ 008 (생명주기 함수)

06 getDerivedStateFromProps(props, state) 컴퍼넌트가 새로운 props를 받게 되었을 때 state를 변경해줌 constructor( ) 함수 다음으로 실행된다 App.js에서 전달한 prop_value라는 변수를 props.prop_value로 접근해 값 가져옴 보다시피 constructor > getDerived > render 순으로 실행되었다. 07 componentDidMount( ) 생명주기 함수들 중에서 가장 마지막에 실행됨 render( ) 함수가 코드를 화면에 그려준 후 실행됨 화면 그려지는 것이 끝난 후의 이벤트 처리, 초기화 등 가장 많이 활용되는 함수임 08 shouldComponentUpdate() 생명주기 과정 중 component의 변경(prop..

[ReactJS] 리액트 200제 _ ex001 ~ 005

003 component: 특정 코드 뭉치를 다른 부분에 이식하거나 재 사용하기 위해 사용하는 코드 블록 단위 004 생명주기: component의 생성, 변경, 소멸 과정을 뜻함 component 생성 함수 render() constructor() getDerivedStateFromProps() componentDidMount() 005 contructor 함수가 헷갈려 검색해봤다 참고 문서 https://corini.tistory.com/entry/리액트React-학습자를-위한-기초지식-컴포넌트-생명주기 https://www.javatpoint.com/react-constructor contructor(props) 컴포넌트가 실행될 때 가장 먼저 호출되는 함수 생명주기 함수 중 가장 먼저 실행됨 처음..

[Algorithm/BOJ] 01920 : 수 찾기.py

문제 N개의 정수 A[1], A[2], …, A[N]이 주어져 있을 때, 이 안에 X라는 정수가 존재하는지 알아내는 프로그램을 작성하시오. 입력 첫째 줄에 자연수 N(1 ≤ N ≤ 100,000)이 주어진다. 다음 줄에는 N개의 정수 A[1], A[2], …, A[N]이 주어진다. 다음 줄에는 M(1 ≤ M ≤ 100,000)이 주어진다. 다음 줄에는 M개의 수들이 주어지는데, 이 수들이 A안에 존재하는지 알아내면 된다. 모든 정수의 범위는 -231 보다 크거나 같고 231보다 작다. 출력 M개의 줄에 답을 출력한다. 존재하면 1을, 존재하지 않으면 0을 출력한다. 내 풀이 n = int(input()) fa = set(list(map(int, input().split(" ")))) m = int(inp..

Algorithm/BOJ 2022.09.09