IT/React 2019. 1. 8.
[React.Js/JavaScript] 간단 리엑트 스타일( CSS ) 적용하기
[React.Js/JavaScript] 간단 리엑트 스타일( CSS ) 적용하기 React 저번 포스팅에서는 간단하게 컴포넌트를 생성하고 추가하는 작업을 진행하였습니다.오늘은 간단하게 리엑트에 CSS를 입히는 작업을 하도록 하겠습니다.바로 SCSS 를 이용하여 작업을 진행하려고 합니다. * SASS를 알아오도록 합시다.React 2.0 이 나오기 전까지 이 SCSS는 Webpack 작업을 통해서 추가하였습니다만현재는 그냥 node-sass 을 설치하고 사용하면 됩니다. 이렇게요yarn add node-sass매우 쉬워졌습니다.까먹고 실행을 해도 아래와 같은 메세지와 함께 설치를 권유합니다.이후 scss 파일을 생성합니다./src/Components/Display/styles.scss 생성 이후 간단한 c..
IT/React 2018. 11. 4.
[React.Js] 리엑트 간단 컴포넌트 만들기
[React.Js/JavaScript] 간단 리엑트 컴포넌트 만들기 React 저번 포스팅에서는 create-react-app 을 통해서 앱을 실행시키는 방법까지 진행했습니다. npx 또는 yarn 을 통해서 만들었습니다. 이 외에도 Reactjs 용 프레임워크가 존재합니다. 예를 들자면 python -> django , java -> spring 같은 느낌입니다.하지만 지금은 그저 그런게 있구나 정도로만 알아두시면 좋겠습니다. 알아야할것 이번글에서는 리엑트를 통해서 컴포넌트를 생성하고 생성한 컴포넌트를 사용해 보도록 하겠습니다.시작하기 전에 우선적으로 알아야 하는 것은 바로 React의 컴포넌트 개념입니다. https://medium.com/little-big-programming/react 블로그 글..
IT/React 2018. 8. 24.
[React.Js] 리엑트 소개와 간단 앱 실행하기(create-react-app)
[React.Js/JavaScript] 간단 리엑트 소개와 실행하기 React 소개 React는 사용자 인터페이스를 조금 더 쉽게 작성하기 위한 JavaScript 라이브러리 입니다. 페이스북에서 개발하여 현재는 인스타그램, 넷플릭스 등... 여러 유명 서비스에서 사용되고 있는 라이브러리 입니다. React의 컴포넌트 기반의 방식이고 이 컴포넌트 로직은 JavaScript 로 작성하여 React 프로그램을 만들경우 DOM을 이용하여 데이터를 쉽게 전달이 가능하게 합니다. DOM 이란 Document Object Model의 약자로 HTML, XML 문서의 프로그래밍 인터페이스 입니다. 문서의 구조화된 표현을 제공하며 프로그램밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공하여 쉽게 변경할 수 있게 도..
