클래스형 컴포넌트 현재는 리액트에서 함수형 컴포넌트를 장려하고 대부분 클래스형 컴포넌트를 사용하지 않아, 클래스형 컴포넌트가 왜 존재하는지도 모르고 사용하는 경우가 생길 수 있다. 하지만, 클래스형 컴포넌트가 먼저 생겨났고, 문제점이 발생함에 따라 함수형으로 이를 극복

Toast UI Editor 커뮤니티를 만들다보니 Text Editor가 필요해 몇 에디터를 비교해봤다. 무엇보다 사용성에 초점을 두어 내가 사용하기 편한 에디터를 찾게 되었는데, 다름아닌 Toast UI Editor를 선택하게 되었다. Toast UI Editor는

지금까지는 Css혹은 SCSS를 통해 스타일을 적용해왔는데, Css-In-Js로 작성해보는 것도 좋을 것 같아 적용해보기로 했다.그 전에 Css-In-Js는 Css-In-Css에 비해 어떤 차이가 있어 리액트에서 종종 쓰이는지 확인해 보려한다.2014년 페이스북 개발자

간단한 커뮤니티를 개발해보면서 생기는 일들을 조금씩 작성해보려고 프로젝트를 생성하기로 했다. 먼저, 프로젝트에 무엇을 사용할지를 고민하다가 토스 블로그에 올라온 Yarn Berry를 활용해 React를 관리해보기로 결정했다. 프로젝트 생성 일단 어떻게 만들지 계획은

상태관리 지난 포스트에서는 상태에 대해서 알아보았다. 상태란 데이터 바인딩을 통해 변경되는 데이터를 표현하고자 할 때 사용되는 변수라고 정의했다. 그렇다면 이번엔 상태관리는 무엇이고 왜 중요하다고 계속 언급되는건지 조금 알아보려 한다. 상태관리 상태관리란 해석하자면

상태 상태란 무엇일까라는 질문에 리액트를 조금이라도 접해본 사람은 state를 먼저 떠올릴 것이다. 그럼 그 State는 무엇이고, 그걸 관리한다는건 무엇인지 조금 정확히 알아보려 한다. 데이터바인딩 State, 즉 상태를 이해하기 위해서는 변수를 사용하는 방법을 먼

React.js 리액트의 공식 홈페이지에 의한 설명으로 리액트는 UI를 만들기 위한 자바스크립트 라이브러리이다. 페이스북 및 몇 공동체에 의해 개발되어 SPA를 제작하기위해 사용된다. JSX라는 javascript와 xml을 확장한 문법을 사용하며, 컴포넌트라는 개념을

싱글톤 패턴

CSS 방법론 BEM OOCSS SMACSS

소프트웨어 개발 3대 원칙 KIS DRY YAGNI

SOLID 원칙 SOLID는 객체 지향 프로그래밍의 5가지 기본 원칙인 SRP, OCP, LSP, ISP, DIP의 앞글자를 묶어 부르는 이름으로 객체 지향 설계 원칙이라고도 부른다. 가독성과 확장성을 위해 코드의 리팩터링 과정을 반복할 때 사용되는 지침으로, 개발자

디자인 패턴 이 글에서 디자인 패턴은 소프트웨어 디자인 패턴을 말하며, 소프트웨어 개발에서 빈번하게 발생하는 문제에 대해 재사용 가능한 해결책을 모아 일컫는 말이다. 바로 사용할 수 있는 코드가 아니라, 개념이나 서술, 템플릿과 같은 형태로 형식화되어있으며 생성 패턴

Tree 트리 구조는 노드가 계층을 이루고 있는 자료구조로, 나무의 가지형태를 닮아서 트리 구조라고 불린다. 최상위 노드를 루트 노드라고 부르며 하나의 노드 바로 아래에 연결된 노드를 자식 노드라고, 자식 노드의 바로 상위 노드를 부모 노드라고 부른다. 또한, 자식

선형 구조(Linear Structure) 순차 리스트(Sequential List) 순차 리스트란 데이터를 순차적(연속적)으로 메모리에 저장한 자료 구조를 의미한다. 일반적으로 ArrayList가 여기에 속하며, 크기가 정적인 Array와 달리 크기가 가변적이어서

자료구조 자료구조는 영어로 Data Structure로, 말 그대로 자료의 구조를 의미한다. 또한, 컴퓨터 과학(CS)에서 데이터를 구조적으로 표현하는 방법과 알고리즘에 대한 기초 이론 학문을 의미한다. 왜 자료구조를 배워야 하는지, 즉 데이터를 구조적으로 표현하는 방

중간쯤 느꼈던건데, 사실 이 글을 먼저 써야했던게 맞는 것 같다.웹개발 로드맵이라는 이름으로 지은 것도 작명에 문제가 있었던 것 같기는 한데,애초에 이 글은 컴퓨터 관련 대학교 1학년 정도의 지식을 보유했을 때웹 개발로 나가보는건 어떠냐는 의미로 작성해본 글이다.웹을

인증(Authentication) 인가(Authorization) 인증을 이해하기 전에 인증과 인가는 다르다는 것을 먼저 알아두자. 인가는 권한을 주는 것을 의미하여, 누구인지에 상관없이 해당 행위에 권한이 있다면 행위를 할 수 있도록 허가하는 것을 뜻한다.

웹 서비스에 대한 공격은 데이터베이스 조작부터 대규모 네트워크 중단까지 다양하다.이러한 웹 공격으로부터 보호하기 위한 조치로는 암호화, 인증 등 종합적인 웹 보안 전략이 필요하다.따라서 웹 보안을 위한 기초적인 지식으로 https, cors, csp, owasp 을 알

API REST를 알아보려면

CSR 어제 알아본 SPA(Single Page Application)는 CSR(Client Side Rendering)로 동작한다. CSR은 Client Side Rendering, 즉 클라이언트 측에서 렌더링이 동작하는 방식이다. 렌더링이란 쉽게 말하자면 화면에 사