처음부터 시작하는 Java

리액트 컴포넌트 스타일링 Sass 는 CSS pre-processer 두가지의 확장자가 있음 .sass / .scss 보통 .scss 문법이 더 많이 사용된다. 솔직히 걍 JSP에 사용하는 부트스트랩처럼 antd 나 머터리얼 mui 같은 프론드엔드 프레임워크를 쓰는게 정신건강에 좋긴한데 기본적은것은 알고 가야할거 같아서 배워본다. .sass $font-stack: Helvetica, sans-serif $primary-color: #333 body font: 100% $font-stack color: $primary-color .scss $font-stack: Helvetica, sans-serif; $primary-color: #333; body { font: 100% $font-stack; color..

spread spread 의 의미 : 펼치다, 퍼뜨리다. 예를 들어 이런 객체들이 있고 새 객체를 만들 때 마다 앞의 객체의 속성을 그대로 가지고 만들어 줬다. 그러면서 속성은 하나씩 추가가 되었는데 이런 식으로 기존의 것을 건들이지 않고 새로운 객체를 만드는 함수가 spread 놀랍다 매우... 그리고 spread 연산자는 배열에도 사용 할 수 있따. 또한 배열에서 spread 함수를 여러번 사용도 가능! ㅗㅜㅑ... rest 객체에서의 rest rest 안에 head 값을 제외한 값이 들어있다. rest 는 객체와 배열에서 사용 할 때는 이런식의 비구조화 할당 문법과 함께 사용된다. 주로 사용할 때에는 rest 라는 키워드를 사용, 그치만 추출 값한 값의 이름이 꼭 rest 일 필욘없다. 이어서 bo..

배열에 새로운 항목을 추가하는 방법을 알아보자! 우선 input 두개와 button 하나로 이루어진 CreateUser.js 라는 컴포넌트를 components 디렉터리에 생성 import React from 'react'; function CreateUser({ username, email, onChange, onCreate }) { return ( 등록 ); } export default CreateUser; 이번 컴포넌트에는 상태관리를 CreateUser 에서 하지 말고 보무 컴포넌트인 App 에서 하게 하고, input 의 값 및 이벤트로 등록할 함수들을 props 로 넘겨받아서 사용해보자 위의 컴포넌트를 App 에서 UserList 위에 렌더링 해보자 App.js import './App.css..

components/InputSample.jsx import React, { useState } from "react"; function InputSamle() { // text 의 초기 값을 "" 로 설정 const [text, setText] = useState(""); // e.target 이벤트가 발생한 DOM input DOM const displayText = (e) => { setText(e.target.value); }; const onReset = () => { setText(""); }; return ( reset 값 : {text} ); } export default InputSamle; App.js import './App.css'; import InputSample from './..