# components
React props
컴포넌트는 "웹 페이지를 만드는 퍼즐 조각" 이라고 할수있다!개발자는 컴포넌트 조각을 설계하고 만든 컴포넌트를 조합해서 사용자 인터페이스(user interface, UI)를 구축한다.UI 조각인 컴포넌트를 모으면 전체 퍼즐 그림인 웹 페이지를 만들 수 있다.<C
(kotlin) 4 major components of android
액티비티는 사용가가 앱과 상호작용하는 하나의 화면을 의미하며, 사용자에게 드러나는 화면을 의미한다. 사용자와 상호작용을 담당하는 인터페이스이기 때문에 적어도 반드시 하나 이상의 액티비티를 포함하고 있어야 한다. 컴포넌트끼리는 인텐트를 통해 상호작용하기 때문에 인텐트를

React + Spring Boot + MySQL (16)
Login 페이지를 만들어보자다음과 같이 LoginPage와 Login 컴포넌트 파일을 만들어준다.src/pages/LoginPage/index.tsxsrc/components/Login/index.tsxsrc/components/Login/style.tssrc/rou

[React]Tailwind + Styled Components 사용
코드의 가독성 및 유지보수성 향상을 위한 Tailwind와 Styled components를 이용해보자.

웹 브라우저 동작, React 용어, 타입스크립트 개념 정리
웹 브라우저 동작원리 Elements > Decoupling(디커플링, 탈동조화) : 경제용어로는 한 나라의 경제가 보편적이고 세계적인 경기 흐름과 독립적으로 움직이는 현상을 의미합니다. 예를 들어 글로벌 경기침체 시기에 특정 국가는 계속 성장하고 있을 때, 디커플링
[swift] 문자열 나누기
split서브 스트링을 반환서브스트링은 빈 문자열을 포함 하지 않음, 그래서 콤마가 두개여도 빈문자열이 없음componentsString 을 반환빈문자열 포함

Components
ReactJS의 코드 구성은 다음과 같다. 리액트를 아예 모르는 상태에서 보면 App이라는 함수가 HTML을 반환하는 형식이다. 저렇게 구성된 App은 기본적으로 생성된 index.js 파일에서 모듈 형태로 불러와지고, 다음과 같이 사용된다.create-react-ap

[HIG] Components - Boxes
스테퍼는 값을 증감시키는 두 세그먼트 컨트롤로 이루어진 UI 요소이다.Untitled스테퍼 자체는 값을 표시하지 않기 때문에 현재 값을 표시하는 필드 옆에 배치한다.스테퍼가 영향을 미치는 값을 명확하게 하라.스테퍼 자체로는 값을 표시할 수 없으므로 사

[HIG] Components - Boxes
box는 논리적으로 관련이 있는 정보와 구성 요소들을 포함하여 다른 요소들과 시각적으로 구별되는 그룹으로 만드는 방법이다. 기본적으로 box는 테두리 혹은 배경색의 구분을 통해 다른 인터페이스 요소들과 구분한다.

React Styled-Components
리액트를 사용할 때 css처럼 사용하려면 어떻게 할까?Styled Components를 이용하면 된다.사용 방법Styled-Components import해 불러와준다.구분할 수 있는 태그로 변경해 작업을 해보겠다.이제 변수선언 구간에 Styled-Components작
[React] 자식 컴포넌트에서 함수 끌어올리기가 안 될 때, 두 번씩 함수가 불러질 때
모달을 만드는 와중에 에러가 났다 상황 ❗ 자식컴포넌트에서 버튼을 클릭하면, 부모컴포넌트에 있는 함수가 실행되게 하고 싶다. 이렇게 props 이름 다 맞춰도 함수가 두 번씩 is not function 에러를 내뿜을 때 SOLUTION ✅ 부모 컴포넌트에서 화
카카오 FE 기술 블로그 '아토믹 디자인을 활용한 디자인 시스템 도입기' 정리
이 글은 카카오 FE 기술 블로그 '아토믹 디자인을 활용한 디자인 시스템 도입기'를 정리한 글입니다. ⭐ 카카오 FE 기술 블로그 '아토믹 디자인을 활용한 디자인 시스템 도입기' 바로가기container-presentational 패턴을 사용했었습니다. 그러나 문제가

조금조금 REACT, CSS in JS
JS의 문법체계에서 CSS를 제어한다는 것은 어떤 것일까? 정적으로 기록되었던 CSS를 동적으로 조작이 가능하게 된다는 말이 아닐까?

3월1일(수) React: Components & Rendering, Styling, 반복되는 컴포넌트 처리, 컴포넌트 분리하기(독립 컴포넌트)
오늘은 나머지 React 기초주차 강의 학습 내용을 정리해보겠다.Components부터 Rendering, Styling, 반복되는 컴포넌트 처리, 컴포넌트 분리하기(독립 컴포넌트)가 있겠다.컴포넌트는 리액트의 핵심 빌딩 블록 중 하나. 즉 리액트에서 개발할 모든 애플

2월25일(토) 본격적인 React학습!(React에서 부터 개발환경 세팅, CRA, 컴포넌트까지 )
본격적으로 React학습을 시작해보았다. 생각한것보다 아직까지는 개념들이 많이 어렵지 않았고 낯설지 않아 공부하는데 즐거웠다. 또한 간만에 어려움없이 수업을 따라가니 React하는 게 재미있었다. 이번부터 다음 주 초까지는 매일 강의를 들으며 공부했던 것들을 정리하고

[React] Components and Props
Components와 Props의 정의, Props의 특징 및 사용법, Component 만들기 및 렌더링, Component합성과 추출, (실습) 댓글 컴포넌트 만들기를 하면서 Components와 Props에 대해 알아보자!

React 기초정리 (Components)
컴포넌트는 컴퓨터 소프트웨어에 있어서, 다시 사용할 수 있는 범용성을 위해 개발된 소프트웨어 구성 요소를 일컫는다.리액트에서 컴포넌트는 class형, function형으로 나뉜다. 개념적으로 컴포넌트는 JavaScript 함수와 유사하다. “props”라고 하는 임의의