Data_study_clip
close
프로필 배경
프로필 로고

Data_study_clip

  • 분류 전체보기 (244)
    • 빅데이터 (9)
    • R + 통계 (7)
    • Python +머신러닝 (8)
    • DB + SQL (23)
    • 네트워크 (12)
    • Java (45)
    • C# (3)
    • JSP(JavaServerPage) (6)
    • HTML + CSS (4)
    • JavaScript (15)
    • JavaFx (1)
    • Git (9)
    • OS (7)
    • Python (0)
    • AI (5)
    • 도서 (7)
    • 경영 (7)
    • Spring (31)
    • ElasticSearch (12)
    • DesignPattern (2)
    • Docker (4)
    • React (11)
    • 개인정보보호 (2)
    • Spring Security (1)
    • Backend (5)
    • FreeMarker (1)
    • NodeJS (1)
    • 자료구조+알고리즘 (1)
    • 일기 (2)
  • 홈
  • 태그
  • 방명록
React - 기본예제) 시계 만들기

React - 기본예제) 시계 만들기

프로젝트 구조 1. Clock.jsx import React from "react"; function Clock(props){ return( 안녕, 리액트! 현재 시간 : {new Date().toLocaleTimeString()} ); } export default Clock; 2. neonStyle.css .neonText{ color: #fff; text-shadow: 0 0 7px #fff, 0 0 10px #fff, 0 0 21px #fff, 0 0 42px #0fa, 0 0 82px #0fa, 0 0 92px #0fa, 0 0 102px #0fa, 0 0 151px #0fa; text-align: center; } #clock-header{ margin-top: 10%; } 3. index.c..

  • format_list_bulleted React
  • · 2022. 8. 29.
  • textsms
React Elements 의 특징

React Elements 의 특징

1. immutable (불변성 ) 즉 Elements가 불변성의 특징을 가진다는 것은 Elements 생성후에는 chiledren이나 attributes를 바꿀 수 없다는 것을 의미한다. 붕어빵틀에 붕어빵속에 슈크림이 들어가던 팥이 들어가던 틀어 구워져서 만들어지기 전에는 다양한 붕어빵이 될 수 있지만 한번 슈크림이 들어가서 구워지면 그 속을 다시 팥으로 바꿀 수 없는 것과 마찬가지이다. 2. Root DOM Node 모든 리액트 앱은 단 하나의 Root DOM Node를 가지게 된다. 반면에 기존에 있던 웹사이트에 추가적으로 React를 연동하게되면 여러개의 분리된 수많은 Root DOM node를 가지게 될 수 도 있다. Root dvi에 실제로 React Elements를 랜더링 하기 위해서는 다..

  • format_list_bulleted React
  • · 2022. 8. 28.
  • textsms
React - Rendering Elements와 React.createElements() 함수에 대해서

React - Rendering Elements와 React.createElements() 함수에 대해서

React Elements React의 official document를 참고하면 다음과 같은 내용을 볼 수 있다. Elements are the samllest building blocks of React apps. 즉 리액트 앱을 구성하는 가장 작은 블록을 Elements라고 한다. 아래의 사진과 같이 우리가 크롬에서 개발자 도구로 Elements 탭에서 보는 것들은 DOM Elements이다. 그렇다면 React Elements란 무엇일까? 너무나 심플하게도 Virtual DOM에 있는 Elements 를 React Elements라고 한다. 결국 React Elements는 DOM Elements의 가상표현이라고 볼 수 있다. 다만 DOM Elements는 React Elements에 비해서 많은..

  • format_list_bulleted React
  • · 2022. 8. 28.
  • textsms
JSX의 개념과 장점

JSX의 개념과 장점

JSX(JavaScriptXML)란? A syntax extension to javaScript : 자바스크립트의 확장 문법 이라는 뜻으로 JavaScript에 XML을 추가하여 확장한 문법이다. 다음의 기초적인 JSX 코드 예시를 보자 const element = Hello, world! 뭔가 자바스크립트 코드같은데 대입연산자 옆에를 보면 HTML코드가 들어가 있다. 이와 같이 Javascript와 HTML코드를 일정한 문법규칙을 가지고 혼용해서 사용할 수 있는 문법이 JSX 문법이다. JSX는 이랙트로 프로젝트를 개발할 댸 사용되므로 공식적인 자바스크립트 문법은 아니다. 또한 브라우저에서 실행하기 전에 바벨이라는 것을 사용하여 일반 자바스크립트 형태의 코드로 변환되기 때문에 우리가 JSX코드로 작성한..

  • format_list_bulleted React
  • · 2022. 8. 28.
  • textsms

SPA(SinglePageApplication) 와 React에 대해서

SPA 규모가 큰 웹사이트의 경우 수백개의 웹페이지가 존재하는데 이것을 각 페이지마다 HTML로 만드는 것은 상당히 비효율적이고 관리하기 힘들다. 그래서 하나의 HTML에다가 사용자가 특정 페이지를 호출할 때 그 HTML에다가 내용을 채워서 보내주는 것이 SPA이다. 이러한 SinglePageApplication을 만드는데 가장 많이 쓰이는 javascript 라이브러리 중 하나가 바로 React이다. React의 장점 1. 빠른 업데이트와 렌더링 속도 React에서는 빠른 업데이트를 위해서 Virtual DOM이라는 것을 사용하는데 말 그대로 가상의 DOM인데 React JS는 메모리에 Virtural DOM를 보관하고 유저가 보고 있는 Real DOM 동기화한다. 기존의 방식은 DOM을 직접 수정하는..

  • format_list_bulleted React
  • · 2022. 8. 27.
  • textsms
  • navigate_before
  • 1
  • 2
  • navigate_next
공지사항
전체 카테고리
  • 분류 전체보기 (244)
    • 빅데이터 (9)
    • R + 통계 (7)
    • Python +머신러닝 (8)
    • DB + SQL (23)
    • 네트워크 (12)
    • Java (45)
    • C# (3)
    • JSP(JavaServerPage) (6)
    • HTML + CSS (4)
    • JavaScript (15)
    • JavaFx (1)
    • Git (9)
    • OS (7)
    • Python (0)
    • AI (5)
    • 도서 (7)
    • 경영 (7)
    • Spring (31)
    • ElasticSearch (12)
    • DesignPattern (2)
    • Docker (4)
    • React (11)
    • 개인정보보호 (2)
    • Spring Security (1)
    • Backend (5)
    • FreeMarker (1)
    • NodeJS (1)
    • 자료구조+알고리즘 (1)
    • 일기 (2)
최근 글
인기 글
최근 댓글
태그
  • #보통주
  • #빅데이터 #빅데이터의 특징 #빅데이터의 정의 #빅데이터란 #빅데이터특성 #3V #5V
  • #메모습관 #신정철
  • #Hadoop #RDBMS #NoSQL #MapReduce
  • #의존성주입 #DI #Spring
  • #우선주
  • #보통주와우선주
  • #ApacheServer
  • #데이터 수집기술
  • #TDD #JunitTest
전체 방문자
오늘
어제
전체
Copyright © 쭈미로운 생활 All rights reserved.
Designed by JJuum

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.