241114 리액트 (개요 / 컴포넌트 생성 / 배포 / 데이터 전달 (Props and State) / CSS 및 이미지 적용)

241114 에이콘 아카데미 수업에 기반하여 작성되었음을 알립니다.리액트리액트는 자바스크립트 라이브러리로 구성되어있다.목적은 프론트엔드에서 MVC 패턴을 구사하기 위한 목적이 있다.대표적인 예들은 리액트, 뷰 등이 있다.현재는 리액트가 세상을 지배하고 있다.리액트를 통해 클라이언트 사이드의 화면구성을 멋들어지게 할 수 있다.우리의 목표는 RESTful 활용에 있다. 화면 구성은 각자 해보도록 하자HTML 사용 시 RESTful을 사용하여 SPA를 구성할 수 있긴 하지만 번거로운 부분이 있다.SPA 구성할 시 리액트를 사용한다면 더 쉽게 구현 가능하다.리액트와 관련된 새로운 기술, 문법 등을 이해해보자.리액트는 거대한 커뮤니티를 가지고 있다. 지속적인 버전 관리가 이루어지고 있으며, 다양한 레퍼런스 및 확..

• format_list_bulleted Study/Acorn
• · 2024. 11. 14.
• textsms

241113 왓쇼이켄

왓쇼이켄뭐 하나 빠지는 게 없다.기록돈코츠라멘, 염도는 짠맛 선택왓쇼이켄 가면 열에 아홉은 쇼유라멘을 먹지만오랜만에 돈코츠로 주문, 역시 뭐 하나 빠지는 구석이 없다.해물맛을 좋아하거나 비린 맛에 내성이 있다면 교카이 돈코츠도 추천메뉴라멘쇼유라멘  9.0돈코츠라멘  9.0돈코츠 쇼유라멘  10.0교카이 돈코츠라멘  10.0...사이드 / 토핑볶음 야채  2.0수제 가라아게 4P  5.0수제 가라아게 7P  7.0삼겹 차슈  2.0수비드 차슈  2.0...음료 / 주류콜라  2.0제로콜라  2.0사이다  2.0소주  5.0맥주  6.0...정보주소 : 서울 강남구 테헤란로4길 46 쌍용플래티넘밸류 지하1층 B120호 영업시간 :월요일  11:00 ~ 20:00화요일  11:00 ~ 20:00수요일  11:..

• format_list_bulleted Daily/Yummy
• · 2024. 11. 13.
• textsms

241113 WebSocket / 리액트 설치

241113 에이콘 아카데미 수업을 기반하여 작성되었음을 알립니다.WebSocketWebSocket은 기존의 단방향 HTTP 프로토콜과 호환되어 양방향 통신을 제공하기 위해 개발된 프로토콜.Http 통신은 무상태성, 비연결성, 단방향 통신, 실시간 통신인 채팅 기능을 운영할 수 없다.처음부터 WebSocket을 사용하지는 못하고 Http로 접속, 타겟팅을 한다음에 WebSocket 사용하여 통신할 수 있다.WebSocket 통신은 양방향 통신이 가능 HTTP 통신과 다르게 연결을 맺고 바로 끊어버리는 게 아니라 계속 유지를 하기 때문에 실시간 통신에 적합하다.먼저 STOMP 프로토콜에 대해서 이해를 해야 한다.STOMP (Simple Text Oriented Messaging Protocol, 스트리밍 ..

• format_list_bulleted Study/Acorn
• · 2024. 11. 13.
• textsms

241112 파일 업로드 (DB) / Security

241112 에이콘 아카데미 수업을 기반하여 작성되었음을 알립니다.파일 업로드 (DB) / SecurityDB에 파일을 업로드하게 된다면 어디서든 불러다 쓸 수 있다는 장점이있다.단점으로는 이미지나 사운드의 양이 엄청 많다면 DB가 무거워진다는 단점이 있다. 백업과 복구가 힘들다!이미지의 경우에 있어서는 DB에 집어넣는 방법이 더 좋지만 사운드의 경우는 무겁기 때문에 비추천된다.clob, blob 타입 알아보기!DB에서 이미지 분류/분석, base64로 인코딩된 이미지 패턴을 DB에 집어넣어, DB는 패턴을 파악하여 어떤 이미지인지 판단함!API를 읽어보는 것이 중요하다!! 우리는 이미 만들어져있는 라이브러리를 가져다가 프로젝트를 만드는 것!시큐리티, CSRF 공격파일 업로드 실습 (DB)테이블 생성cr..

• format_list_bulleted Study/Acorn
• · 2024. 11. 12.
• textsms

241109 오소록

오소록돔베고기도 먹을걸기록성시경 먹을텐데 맛집고기 국수 곱배기 한 그릇진한 육수, 잘 삶아진 촉촉한 고기이 정도면 굳이 제주도까지 가서고기 국수를 먹을 이유가 있을까?혼자 가서 돔베고기는 못먹음메뉴식사고기국수  9.0비빔국수  9.0얼큰고기국수  9.0돔베고기(반)  14.0돔베고기(도마)  25.0창도름순대  13.0...주류소주  5.0맥주  5.0한라산  6.0...정보주소 : 서울 동대문구 전농로3길 1-2 1층 영업시간 : 월요일  휴무화요일  11:30 ~ 21:00수요일  11:30 ~ 21:00목요일  11:30 ~ 21:00금요일  11:30 ~ 21:00토요일  11:30 ~ 21:00일요일  11:30 ~ 21:00브레이크타임  15:00 ~ 17:00

• format_list_bulleted Daily/Yummy
• · 2024. 11. 9.
• textsms

241108/241111 파일 업로드/다운로드

241108/241111 에이콘 아카데미 수업을 기반하여 작성되었음을 알립니다.파일 업로드 / 다운로드파일 업로드 / 다운로드는 스프링에서 내부적으로 지원!웹 프로젝트 내에 업로드 폴더를 만들고 해당 폴더에 업로드 / 다운로드를 진행하면 된다!방법 1 (가장 일반적인 방법)업로드 폴더 (외장 하드)에 담아두고 DB에는 해당 파일의 경로명 및 파일명만 저장하고, 경로명 및 파일명을 읽어와 show 해주면 된다.방법 2업로드 폴더말고 DB에 직접 저장할 수 있다. 장점으로는 DB만 들고다니면 된다. 단점으로는 수가 많아지면, 용량이 커지만 DB 용량도 커질 수 있다.SPA 구현 시 지능형 웹까지 쓸 수 있다면 거의 배울거는 다 배웠다고 볼 수 있다. 자바스크립트 라이브러리도 써보자~웹표준, UX/UI에 관한..

• format_list_bulleted Study/Acorn
• · 2024. 11. 8.
• textsms

241107 RESTful / AOP

241107 에이콘 아카데미 수업을 기반하여 작성되었음을 알립니다.RESTfulRESTful H2 데이터베이스로 서버 사이드 만들기!HTML화면은 각자 만들어보기!RESTful 실습 (H2)dependenciesH2 Database / Lombok / Thymeleaf / Spring Web / Spring Boot DevTools / Spring Data JPAapplication.propertiesspring.application.name=sprweb37todolistserver.port=8888spring.thymeleaf.cache=false#H2DBspring.datasource.driver-class-name=org.h2.Driverspring.datasource.url=jdbc:h2:file..

• format_list_bulleted Study/Acorn
• · 2024. 11. 7.
• textsms

241106 RESTful (CRUD/문제)

241106 에이콘 아카데미 수업을 기반하여 작성되었음을 알립니다.RESTful겟/포스트 방식만 사용하는 것보다 싱글페이지어플리케이션을 구현하기 위해 레스트풀을 사용하면 쉽게 구현 가능하다 html/자바스크립트/css만으로도 구현 가능하다!일반 html 요청과 레스트풀 요청으로 나누어서 컨트롤러 작성자바스크립트, 함수를 잘 알면 새로운 기술이 나와도 금방 적응 가능하다~RESTful 실습 (CRUD) dependencies Spring Web / Spring Boot DevTools / Spring Data JPA / Lombok / MariaDB Driver / Thymeleaf application.propertiesspring.application.name=sprweb35restful_memserv..

• format_list_bulleted Study/Acorn
• · 2024. 11. 7.
• textsms

241105 RESTful (PUT/DELETE/문제)

이전 글과 이어서 진행됩니다.RESTful 실습 3 (PUT/DELETE)controllerpackage pack.controller;import org.springframework.web.bind.annotation.PutMapping;import org.springframework.web.bind.annotation.RequestBody;import org.springframework.web.bind.annotation.RestController;@RestControllerpublic class PutController { @PutMapping(value = "/hiput") public String put1() { // 용도는 자료 수정 System.out.println("put 요청1 처리")..

• format_list_bulleted Study/Acorn
• · 2024. 11. 5.
• textsms

241105 RESTful (GET/POST)

241105 에이콘 아카데미 수업을 기반하여 작성되었음을 알립니다.RESTfulAJAX를 운영하고 있다면 RESTful을 필수적으로 알아야 한다.RESTful 하나의 프로그래밍 기법이다. 웹의 장점을 최대한 활용할 수 있는 아키텍처, 하나의 스타일인 것이다.모바일, 웹 프로그래밍, 클라우드와 소통할 수 있는 아키텍처하지만 REST를 사용했다 하여 모두가 RESTful 한 것은 아니다.  REST API의 설계 규칙을 올바르게 지킨 시스템을 RESTful 하다고 할 수 있다.클라이언트가 요청할 때 GET/POST 방식만 써왔다. 서버도 마찬가지로 GET으로 요청이 왔을 때 GET 방식으로 응답, POST 방식으로 요청이 왔을 때 POST 방식으로 응답해왔다.GET / POST 방식으로 모든 CRUD가 가능..

• format_list_bulleted Study/Acorn
• · 2024. 11. 5.
• textsms