본문 바로가기

전체 글13

[React] 02. 이벤트 처리하기 const submitHandler = (event) => { event.preventDefault(); // 다시 로드되는 것을 막음 //... console.log("SUBMIT"); }; // Calculate 버튼을 눌렀을 경우 실행됨 const resetHandler = () => { //... console.log("RESET"); }; // Reset 버튼을 눌렀을 경우 실행됨 const inputchangeHandler = (input, value) => { console.log(input, value); }; // 사용자가 input 창에 입력을 하면 실행됨 현재는 console.log()를 통해 콘솔창에 출력하는 기능밖에 없지만 Usestate, 정보 내리기, 올리기 등을 통해 기능을 .. 2023. 8. 27.
[React] 01. 사용자 컴포넌트로 분할하기 헤더, 폼, 테이블은 중요한 논리적 구성 요소이기에 별도의 사용자 컴포넌트로 분할한다. import logo from '../../assets/investment-calculator-logo.png'; const Header = () => { return ( Investment Calculator ); }; export default Header; //Header.js 파일 const ResultsTable = () => { return ( Year Total Savings Interest (Year) Total Interest Invested Capital YEAR NUMBER TOTAL SAVINGS END OF YEAR INTEREST GAINED IN YEAR TOTAL INTEREST GAINE.. 2023. 8. 27.
[React] 00. 연습 프로젝트를 통해 React 학습 시작 Udemy에 있는 React 강의를 여태까지 섹션 8까지 들으면서 기본적인 바닐라 자바스크립트, JSX 또한 특수한 React의 구문에 대해 학습하였다. 이제부터 웹 어플리케이션을 하나 완성시켜가면서 배웠던 것을 복습하겠다. import logo from './assets/investment-calculator-logo.png'; function App() { const calculateHandler = (userInput) => { // Should be triggered when form is submitted // You might not directly want to bind it to the submit event on the form though... const yearlyData = []; .. 2023. 8. 26.
2023-07-20 백준 2164번 클래스 문제를 따라풀다가 자료구조 중 큐를 활용해야 하는 문제를 만났다. C++ STL의 큐를 사용해도 되지만 직접 구현해 보기로 하였다. 22년도 겨울 계절학기에 자료구조를 수강한 기억을 떠올려서 이중 연결리스트를 활용하여 큐를 구현하였다. /* * 백준 2164 카드2 문제 알고리즘 분류에 큐가 있어서 큐를 사용한다. * 위, 오래된 것, 삭제 연산 수행, tail, 앞 * 아래, 최신의 것, 삽입 연산 수행, head, 뒤 * 카드는 아래에서 넣고 위에서 뺀다 * 큐는 뒤에서 넣고 앞에서 뺀다. */ #include using namespace std; class node { public: int data; node* prev; node* next; node(int n) { this->data = .. 2023. 7. 20.