[React] 미니프로젝트 - 일기장 Home 화면 구현하기
2022. 8. 5. 23:16
개발/Inafolio
수정 전/ 후 홈 모습 날짜헤더 등록하기 mount가 됨과 동시에 날짜가 표시되어야 하고 월을 이동할 버튼이 필요함 import { useState } from "react"; import MyHeader from './../components/MyHeader' const Home = () => { const [curDate, setCurDate] = useState(new Date()); const headText = `${curDate.getFullYear()}년 ${curDate.getMonth() + 1}월` return ( ); }; export default Home; useState를 통해 날짜를 set해준다. 전에 헤더로 만들어두었던 MyHeader 컴포넌트를 import 해주고 MyHea..
[React] 프로젝트 기초공사하기2 - 상태분리, Provider
2022. 8. 3. 20:49
개발/Inafolio
React Redux useReducer(); 상태관리 함수인 useState 대신 useReducer를 사용할 것이다. 컴포넌트 상태 업데이트 로직을 컴포넌트 바깥이나 다른파일에 작성 후 불러올 수 있다. const [data, dispatch] = useReducer(reducer, []); 앱 컴포넌트안에 useReducer() 훅을 불러온다. reducer const reducer = (state, action) => { let newState = []; switch (action.type) { case 'INIT': { return action.data; } case 'CREATE': { const newItem = { ...action.data } newState = [newItem, ...s..
[React] 프로젝트 기초공사하기 - 공통 컴포넌트, 폰트, 레이아웃 css 셋팅
2022. 8. 2. 20:19
개발/Inafolio
폰트 설정 Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com 구글폰트에 있는 나눔펜스크립트와 연성폰트를 사용한다 import style 내 url과 css font-family를 App.css에 등록해줬다 레이아웃 셋팅 모든 페이지에 반영되는 레이아웃 셋팅을 할 것이다. 흰색 메인 컨텐츠, 바탕 회색등의 모든 페이지에 공통되는 스타일을 추가할 것 React 앱은 index.js파일에서 앱 컴포넌트가 랜더링되는 JSX요소들을 아이디가 루트를 갖는 요소를 자식으로 가지면서(getElementById('root') 화면에 추가되는 원리. 그 증거로 요소 확인시 App컴포넌트는 ro..
[혼공단 8기] 4주차 미션
2022. 7. 31. 14:06
개발/Inafolio
[Java] 스레드 제어 스레드 상태? 스레드 객체를 생성하고 start() 메소드를 호출하면 바로 실행되는 것이 아니라 실행 대기 상태가 된다. 운영체제는 실행 대기 상태에 있는 스레드 중 하나를 선택해 실행 상태로 만 h-owo-ld.tistory.com 550페이지 직접해보는 손코딩 public class AutoSaveThread extends Thread{ public void save() { System.out.println("작업 내용을 저장한다"); } @Override public void run() { while (true) { try { Thread.sleep(1000); } catch (InterruptedException e) { break; } save(); } } } publi..
[혼공단 8기] 3주차 미션
2022. 7. 24. 18:14
개발/Inafolio
혼공노트를 전체적으로 읽어보고 다음주에 시작할 미션인 12주! 내용을 읽어보았다 p512 8번 포장객체 내부의 값 비교 public class IntegerCompareEx { public static void main(String[] args) { Integer obj1 = 100; Integer obj2 = 100; Integer obj3 = 300; Integer obj4 = 300; System.out.println( obj1 == obj2); System.out.println( obj3 == obj4); } } 실행결과 이유 타입 값의 범위 boolean true, false char \u0000 ~ \u0071 byte, short, int -128 ~ 127 박싱된 값이 다음 표에 나와있는 ..