럭키베이비 스토리

https://youtu.be/Qe83Ss3zh74?si=yCKvNI5ByXy-5TNC 웹페이지 로딩 속도를 향상시키는 10가지 방법에 대해 설명합니다:파일 압축: HTML, CSS, 자바스크립트 파일을 압축해서 전송하면 로딩 속도를 줄일 수 있습니다. 예를 들어 Gzip이나 브로틀리 압축 알고리즘을 사용할 수 있습니다.이미지 최적화: JPG, PNG 대신 압축률이 높은 이미지 형식(WEBP 등)으로 변환하거나 이미지 크기를 줄이는 것이 중요합니다.HTTP 업그레이드: HTTP/2나 HTTP/3로 업그레이드하면 동시에 더 많은 파일을 전송할 수 있어 로딩 속도가 향상됩니다.CDN 사용: CDN(콘텐츠 전송 네트워크)을 활용해 사용자와 가까운 서버에서 데이터를 전송하면 지연 시간을 줄일 수 있습니다.데이터..

이클립스(Eclipse) IDE에서 사용되는 단축키는 개발자의 생산성을 크게 향상시킬 수 있습니다. 다음은 이클립스에서 가장 유용하게 사용되는 단축키입니다:Ctrl + Shift + R: 파일 열기설명: 프로젝트 내의 모든 파일을 검색하고 열 수 있습니다. 파일 이름의 일부만 알아도 빠르게 찾을 수 있습니다.Ctrl + Shift + F: 코드 자동 포맷팅설명: 선택한 코드 블록이나 전체 코드를 자동으로 포맷하여 일관된 스타일로 정리합니다.Ctrl + Space: 코드 자동 완성설명: 코드 작성 중 변수, 메소드, 클래스 등의 자동 완성 제안을 제공합니다.F3: 정의로 이동설명: 커서가 위치한 변수, 메소드, 클래스의 정의로 빠르게 이동합니다.Ctrl + Shift + T: 타입 검색설명: 클래스, 인터..

1. 프론트엔드 프레임워크 및 라이브러리React, Vue.js, Angular와 같은 프론트엔드 프레임워크는 최신 웹 개발의 필수 도구입니다. 이들 중 React는 현재 가장 널리 사용되는 프레임워크로, 다양한 라이브러리와 에코시스템의 지원을 받을 수 있습니다.React: 컴포넌트 기반 아키텍처로 UI를 구축합니다. 빠른 렌더링과 상태 관리를 위해 Redux 또는 Recoil과 같은 상태 관리 라이브러리를 사용할 수 있습니다.Next.js: React와 함께 사용되는 인기 있는 프레임워크로, 서버 사이드 렌더링(SSR), 정적 사이트 생성(SSG), API 라우팅 등의 기능을 제공합니다.Tailwind CSS: 유틸리티 기반의 CSS 프레임워크로, 모바일 친화적인 반응형 디자인을 쉽게 구현할 수 있습니..

React 백엔드 연동1 에서 만든 코드를 실행해보면 json 데이터를 그대로 화면에보여주고 있습니다. 이번에는 json 데이터를 표형태로 변환해서 보여주도록 코딩을 변경하는 방식으로 코드를 수정합니다. 그리고 화면이 처음수행 될 때 실행버튼 클릭이 자동으로 한번 수행되어 목록을 조회하도록 해줍니다.import React, { useState, useEffect } from 'react';import './App.css';function App() { const [items, setItems] = useState([]); const fetchItems = async () => { try { const response = await fetch('/getList'); //백엔드 url ..

React 화면 기능을 아래와 같이 구현하려 합니다. 1. '생성' 버튼과 목록을 만든다2. 버튼을 클릭하면  json 형태의 목록데이터를 리턴해주는 백엔드 url을 호출하고     결과를 화면에 목록으로 보여준다.import React, { useState } from 'react';import './App.css';function App() { const [items, setItems] = useState([]); const fetchItems = async () => { try { const response = await fetch('/getList'); //백엔드 url const data = await response.json(); setItems(data);..

React 설치(react_no_001)후 터미널에 아래와 같이 입력한다 (생성할 경로로 이동후 실행)npx create-react-app my-app src 폴더 내에 있는 App.js 파일을 열어 기본 코드를 샘플 코드로 대체합니다. 아래의 샘플 코드를 App.js에 복사해 넣으세요.import React from 'react';import './App.css';function App() { return ( Welcome to React This is a simple React application. Learn React );}export default App;..

https://m.blog.naver.com/jang_delay/222131244354 Window에 SpringBoot Service 등록스프링부트로 개발을 완료 후, 외장 톰캣에 배포하려 했더니 스프링부트를 스프링 구조로 바꿔줘야 하는 단...blog.naver.comhttps://youtu.be/zxM6ppSGeJY

JavaScript의 `concat()` 메소드는 배열에 다른 배열이나 값들을 연결하여 새로운 배열을 생성합니다. 기존 배열은 변경되지 않고, 새로운 배열이 반환됩니다. `concat()` 메소드는 다음과 같은 구문을 가집니다: array.concat(value1, value2, ..., valueN) 여기서 `array`는 기존 배열이고, `value1`, `value2`, ..., `valueN`는 연결할 다른 배열이나 값들입니다. 인자로 전달된 값들은 연결 순서대로 새로운 배열에 추가됩니다. 다음은 `concat()` 메소드의 예제입니다: const array1 = [1, 2, 3]; const array2 = [4, 5, 6]; const array3 = array1.concat(array2); ..

1. cmd 창 호출 2. 아래 명령어 입력 후 엔터 netstat -ano 3. 목록에서 확인대상 포트의 pid 확인 4. 작업관리자 >세부정보에서 해당 pid 로 실행되는 프로그램 작업끝내기 https://studyforus.tistory.com/244 윈도우에서 사용중인 포트 확인하고 실행중지하기 사용중인 포트 확인하고 중지하는 두가지 방법 윈도우로 서버 구축하는 내용에 대해서 적다보니 항상 많이 질문하는 내용중에 하나가 80포트를 사용할 수 없다. 또는 21포트가 안된다 등등의 질 studyforus.tistory.com

예시 2017 년 ~ 2022 년도까지 년도값을 컬럼형태로 나열해서 보여주기 전달 파라메터 yearFrom : 시작년도 yearTo : 종료년도 SQL select 'year' as year -- , 때문에 생성한 더미 컬럼 ,'${x?c}' as year_${x?c} -- 또는 year_${x - yearFrom + 1} from dual 문법참조 https://freemarker.apache.org/docs/ref.html Template Language Reference freemarker.apache.org