e7e

React에서 의외로 꽤나 필요성이 높은 훅이 useDebounce당.프론트 프레임워크에선 ajax(api 요청)를 많이 쓰다보니,실시간으로 ajax요청을 남발하면  서버에 부하가 옴팡지게 많이 걸려서,성능상 문제가 발생하게 된당.요따구 상황에서 쓰면 좋은 거이 useDebounce당. 이상하다, 항상 말이란 건 느끼미가 부족하당. 공감력이 떨어진당. 괜찮당. 먼저 debounce가 무엔지 알아보고, 다음 댄스 스텝을 밟아보장. 참고로 debounce란 말은 하드웨어서 나왔는데.  스위치가 순간적으로 on/off를 반복하게 되는 걸 bouncing이라 하고 (오 머리 아프겠당),그걸 못하게 하는 거시  debounce당.~~ 그렇당~ 필요할 것은 느끼미당. 우린 소프트웨어적인 debounce를 누느로 공..

React 2025. 3. 11. 09:10

갑자기 뺑뺑이가 필요해졌다.(보통 Loading 중을 표시할 때 요긴하당) 자바스크립트로도 만들 수는 있지만, 타이밍 조절 때 꽤나 잔 손질이 많이 간당.이럴때는 CSS를 이용하는 것이 매력적이당.일단 아래 소스를 복사/붙여넣기로 결과를 먼저 잡아보장.  외울 필요없당.요걸 항상 시작 템플릿으로 활용해서 필요한 걸 맹글면 그저 좋당. cssani.html 경미니 체킁_ _버튼   화면 모습이당.   아마도 색깔도 바뀌고  크기도 바뀌고모서리도 바뀌고를  반복 할꺼이당. 바뀌고 바뀌고 바뀌고를 반복하는 이런 걸애니라 했던가             결과를 보았다면 이제 이해의 길을 출발 해보장. 해 떴낭?먼저 애니메이션 동작을 지정해야 한당. 아래 문법으로 한당.원하는 %를  동작 시..

React 2025. 3. 7. 16:51

2024.12.10 - [React] - React(리액트) 티키타카 21 (Redux -1)이전 글 에서 사용한 redux에는 비동기가 없당.  그러디용 SPA(Single Page Application)에서 비동기 상황을 빼면 아예 할 필요가 없당.앞 글에서 사용한 형식이 redux의 standard reducer 포맷이당.useEffect와 함께 잘 쓴다면, 잘 쓸 수 있을거당. 일단 그건 그렇탕수육! redux에서는 비동기 처리를  조금 더 예쁘고, 일관된 가독성을 부여할 수 있게createAsyncThunk란 걸 제공한당. 참고로 Thunk는 think의 과거형이당.나무위키에서 한번  검색해 보길 간절히 바란당. 상식이 증폭된당. 진행을 위해서  이전 소스를 쪼메만 정돈을 해보도록 하장src/f..

React 2025. 3. 5. 23:29

상태관리가 복잡해지고, 규모가 커질 때는 redux를 쓴당. 어렵다기 보다는 프레임워크 처럼 세팅 과 사용방식에 익숙해지는 것이 뽀인또인데,초보자에게는 상당히 아주 상당히 낯선 느낌이 문제당.낯선 그 느끼미 게으른 뇌에 이건 헷깔리꽁 어렵넹! 이라는 잘못된 결론을 내려버린당. 마치 눈 앞에 오르지 못할 정도로 높아 보이는 산이 있는데, 가보면 땀 좀 빼면 되는데,게으른 뇌가 산 입구에서 막걸리나 한잔 할까라고 유혹의 두 손을 마구 흔들어 된당. 이런 경우에는 헷갈리지 않게  자신만의 순서(꼭 추천 순서가 아니어도 당근 됨!)를정해서 몇번 반복해서 손과 눈의 콜라보를  먼저 성취하는 거이 좋을 지어다.useReducer를 이전에 사용해 본 경험이 있다면 많은 도움이 될꺼당.상태(state),  리듀서(re..

React 2025. 3. 4. 00:14

그냥 따라해서 되면,  쪼메씩 고쳐서 쓰도록 하장. 귀안타~ (^-^) 프로젝트 폴더에 아래 Dockerfile을 맹근당.[배포 dist를 넣어야 하지만..., 잼나게 프로젝트 폴더를 그냥 통째로 넣는당.] vite.config.js 는 port 때문에 아래 처럼 추가하장.// https://vite.dev/config/export default defineConfig({ plugins: [react()], server: { port:8272 }})package.json 도 아래처럼 쪼메만 수정하장 "scripts": { "dev": "vite --host", "build": "vite build", "lint": "eslint .", "preview": "vite pr..

React 2025. 2. 20. 00:40

리눅스는 유닉스(맥이 유닉스기반, 자바를 맹글었던 선마이크로시스템즈의 솔라리스가 유명)가넘 비싸던 시절  유닉스를 공부하고 싶었지만, 살 돈이 모자라던 사람들이 모여서유닉스 동작을 흉네 낸 OS를 맹글면서 시작되었고,그 리더였던 리누스 토발즈는 오픈소스 단체의 대부로 엄청난 영향력을 행사하고 있고,GIT도 맹글었디용 이제 부터 우분투 리눅스를 떨치할껀데, 이런거이 처음이라면(두번째 부턴 흔한 일!~~) 마니 낯설수 있지만,  당신은 도전 천재 또쪈! 도전!!!!!  아래 링크를 눌러 우분투(ubuntu desktop) 데스크탑 버젼 다운로드 받기(사이즈가 커 쪼메 시간 걸림)https://ubuntu.com/download/desktop/thank-you?version=24.04.1&architectur..

리눅스(우분투) 2025. 2. 18. 18:01

war로 패키징 그냥 별 생각없이 따라 해보기 pom.xml 에 아래 추강 org.springframework.boot spring-boot-starter-tomcat provided  pom.xml에 아래 추강com.e7e mydeploy 1.0 war mydeploy  XXXXApplication.java  내용 추가 변경package com.e7e.deploy;import org.springframework.boot.SpringApplication;import org.springframework.boot.autoconfigure.SpringBootApplication;import org.springframework.boot.builder.S..

스프링부트 2025. 2. 10. 19:27

jwt (Json Web Token)을 사용해 보장.아래 글을 읽고 오는 걸 기대하지만 머~ 안 읽고 싶다면 그것도 괘안탕!2024.03.11 - [스프링] - spring boot 3 security 그냥 한번 해보고 한번 더 해보면 잘 될꺼얼!랑 다른 점은 더이상 서버사이드에 인증 정보를 세션으로저장하지 않는다가 핵심이당.   인증된 클라이언트에게 사랑의 증표(토큰)를 주면클라이언트는 요청할 때마다 그 증표를 같이 제시해야 한다.증표에 사탕은 3개까지라 되어 있는데, 5개를 요청한다면 그건 퇴짜당.클라이언트는 증표를 잘 관리해야 한다. 안 그럼 그 증표를 주운 사람이사탕 3개를 먼저 먹어버릴 수 있당. OK? 세션을 이용한 시큐리티도 마찬가지지만, 흐름에 집중해서 몇번 읽으면별거 아닌데, 처음부터 너..

스프링부트 2025. 1. 8. 20:17