유레카

컴포넌트를 선언하는 방식1. 함수 컴포넌트import React from 'react';const TTest = () => { return ( );};export default TTest; 2. 클래스형 컴포넌트import React, { Component } from 'react';class TTest extends Component { render() { return ( ); }}export default TTest; render 함수가 꼭 있어야한다. → 그 안에 보여줘야할 JSX를 반환한다.  함수 컴포넌트와 클래스형 컴포넌트의 차..

자바스크립트초기에는 단순한 연산과 시각적인 효과를 주는 스크립트 언어현재는 웹 어플리케이션에 가장 핵심적인 역할슬랙, 아톰, VScode등을 일렉트론으로 개발(자스로 데스크톱 어플리케이션을 만들 수 있는 프레임워크)페이스북, 디스코드, 페이팔 등등하지만 순수 자바스크립트 만으로는 관리하기 어려움순수자바스크립트 문제 해결위해 프레임워크들 등장프레임워크는 항상 발전하고 새롭게 등장 다양한 프레임워크 리액트 점유율 킹왕짱! 다른 프레임워크의 경우 MVC 아키텍쳐를 사용하고 있음.다른 아키텍쳐와 공통점은 모델과 뷰가 있다는 것.모델은 애플리케이션이 사용하는 데이터를 관리뷰는 사용자에게 보여짐애플리케이션 규모가 크면 복잡해지고 관리를 제대로 하지않으면 성능이저하됨   ⭐ ReactMVC, MVW 등과 다르게 오직..

[URECA] 독서 목표 설정 및 챌린지 달성 지원 웹사이트 구현을 통한 웹 아키텍처 이해 #8 — console.log("Hello, Bug!"); [URECA] 독서 목표 설정 및 챌린지 달성 지원 웹사이트 구현을 통한 웹 아키텍처 이해 #8프로젝트 발표일까지 남은 시간은 단 하루삭제버튼도 만들어야하고독서 진행바도 만들어야했다.하지만 시간이 부족해 로그인과 회원가입 기능을 완료한팀원이 도와줬다.팀원은 독서 진행바를recordoftheday.tistory.com

[URECA] 독서 목표 설정 및 챌린지 달성 지원 웹사이트 구현을 통한 웹 아키텍처 이해 #7 — console.log("Hello, Bug!"); [URECA] 독서 목표 설정 및 챌린지 달성 지원 웹사이트 구현을 통한 웹 아키텍처 이해 #7오늘 하루종일네모 상자처럼 관련 페이지 독서 진행바를 만드려고 노력했으나 실패.. progress 브랜치까지 다 생성되고 코드도 구현잘되고 자바 큰솔에도 오류도 없었으나..진행바가 나타나지 않recordoftheday.tistory.com

[URECA] 독서 목표 설정 및 챌린지 달성 지원 웹사이트 구현을 통한 웹 아키텍처 이해 #6 — console.log("Hello, Bug!"); [URECA] 독서 목표 설정 및 챌린지 달성 지원 웹사이트 구현을 통한 웹 아키텍처 이해 #6어제까지 이제 검색을 하면 책을 서버와 DB에 저장하도록 구현했다.이제 저장 책을 HOME화면에 불러와야한다.progress코드를 짰는데 이렇게 책을 저장하면 오류가 나타난다.  progress코드들을 삭제recordoftheday.tistory.com

어제 쓰고 잤어야했는데 피곤해서 그냥 잠들었다. 마치 어제 작성한거처럼 타임머신을 타고 작성해보겠다. 원래 계획대로라면,사용자가 도서 제목이나 작가 이름을 검색하면 원하는 책의 결과 목록이 나오도록 만들고자 했다.그러나 API를 호출하여 데이터를 출력해 보니, 예상보다 디자인이 만족스럽지 않았다. 하 최대한 간단하게 만들고 싶었다.하지만 클론코딩하는 사이트처럼  버튼을 눌러 새로운 창이 열리고, 그 안에 원하는 도서 정보가 출력되도록 만들면 사용자 입장에서도 더 깔끔한 디자인으로 느껴지고, 보다 편리하게 이용할 수 있을 것 같다고 판단되었다. 토요일에는 그렇게 원하는 도서를 담는 사이트가 api를 통해 출력되도록 구현하는 데 시간을 할애했다.              이렇게 원하는 키워드를 검색하면 관련도..

중요 정보 처리하기보안 파일을 만들때 이름을 오히려 평범하게 하는 것이 좋다. url에 구조/기능/기술/data가 노출되기에  보안은 정석이 있으면 안된다! 왜? 뚫릴 수 있다.🛒 ProductDao.java 상품 데이터베이스 처리데이터베이스에서 상품 목록을 가져오는 역할package com.shop.cafe.dao; // 이 파일이 'com.shop.cafe.dao'라는 그룹(패키지)에 속해 있어import java.sql.*;import java.util.*;import org.springframework.beans.factory.annotation.Value;import org.springframework.stereotype.Component;import com.shop.cafe.dto.Produ..

(9) 그래프 응용 - 백트래킹 a) 해를 찾기 위해서 후보군을 나열하고, 만약 조건에 맞지 않다면 후보군에서 제외하고 돌아와 다음 후보군을 찾는 방식 백트래킹은 트리 구조를 기반으로 DFS 방식을 진행하면서 각 루트에 대해 조건에 부합했는지 체크(Promising)만약 해당 트리에서 조건에 맞지 않는 노드를 발견한다면, 더 이상 탐색을 멈추고, 다른 노드로 가기 위해 현재 가지를 버림(Pruning)백트래킹에서 검색할 후보들을 상태 공간 트리(State Space Tree)로 표현 8-Queens라면 8^8=16,000,000이넘는 경우의 수를 확인해야 하는데 Pruning을 하면 약 4000~5000정도만 탐색하여 92개의 해를 얻게 됨import java.util.LinkedList;import j..

MST 알고리즘Kruskal(대표적인 그리디 알고리즘)서로소 집합 서로소 집합 코드public class DisjointSetExample { // 부모 노드를 저장할 배열 static int[] p; // 집합을 초기화하는 메서드 static void makeSet(int V) { // V개의 원소를 가지는 배열을 생성 p = new int[V]; // 각 원소의 부모를 자기 자신으로 초기화 for (int i = 0; i Kruskal 설명 (O(E log V))이전 단계에서 만들어진 신장 트리와는 상관없이 무조건 최소 간선만을 선택하는 방법 방법: 1. 그래프의 간선들을 가중치의 오름차순으로 정렬한다. 2. 정렬된 간선 리스트..