아무래도 이로률

1. path 관련 npm 설치npm install -D @types/node 2. vite.config.ts 파일 설정- import path from 'path' - resolve 추가import { defineConfig } from 'vite'import react from '@vitejs/plugin-react'import svgr from 'vite-plugin-svgr'import path from 'path'// https://vite.dev/config/export default defineConfig({ plugins: [react(), svgr()], resolve: { alias: { "@": path.resolve(__dirname, "./src"), "..

아이콘은 src/assets 폴더에 home.svg 로 저장함 ./aseets/home.svg  1. img로 svg 적용1-1. import 사용하고자 하는 아이콘을 import 한다. 원하는 이름으로 설정할 수 있다.import home from './assets/home.svg 1-2. img 로 svg 생성 src에 import 한 아이콘명을 넣고, 원하는 className과 alt를 설정하면 끝 1-3. 전체코드 - 예시이기 때문에, 필요없는 코드들은 삭제하였다.import './App.css'import home from './assets/home.svg'function App() { return ( )}export default App  ..

리액트 실행 시 터미널에 npm run dev 를 입력하면5173이 기본 포트번호이다. 이 기본 포트번호를 변경하기 위해서 vite.config.ts 에 server 포트를 추가해주면 된다.  vite.config.tsimport { defineConfig } from 'vite'import react from '@vitejs/plugin-react'// https://vite.dev/config/export default defineConfig({ server: { //서버 추가 host: true, port: 3003 }, plugins: [react()],}) 서버 추가 후 저장을 하면 자동으로 서버가 재시작 되면서 포트번호가 변경된다.

이번에 회사에서 새로운 프로젝트에 참여하게 되었는데 리액트를 처음,, 해보았다,,, gpt가 없었다면 아마 무사히 끝내지 못했을거다. 똥멍청이가 되지 않기 위해선. AI 공부법으로. 공부를. 하는.것. 이겠지. gpt가 알려준 꿀팁들을 정리 및 공부하기 위해 일단 리액트 프로젝트 생성부터 하나하나 정리할것이다 .⠀⢰⠒⠒⠒⢲⠆⠀⠀⢀⠤⢤⡀⠀⡴⠀⠀⢀⣀⣀⣰⣀⣀⡀⠀⠀⠀⠀⠀ ⠀⠀⣎⣀⣀⣀⡜⠀⠀⢰⠃⠀⢠⠇⢰⠓⠂⠀⢀⠔⠒⠒⠲⡄⠀⠀⠀⠀⠀⠀ ⠤⠤⠤⣤⠤⠤⠤⠄⠀⣇⠀⢀⠞⢀⡯⠤⠀⠀⠹⠤⡤⠤⠞⠁⠀⢠⠔⢤⣀⠆  ⠀⠀⢀⡏⠀⠀⠀⠀⠀⠈⠉⠁⠀⡸⠀⠀⠠⠤⠤⠴⠧⠤⠤⠄⠀⠀⠀⠀⠀ 1. Node JS 설치 https://nodejs.org/ko Node.js — 어디서든 JavaScript를 실행하세요Node.js® is a JavaScript runtime..

flutter로 안드로이드 사진 파일 첨부 시 파일 첨부가 안되는 오류가 발생하였다. Chrome 모바일 버전과 iOS에서는 파일 첨부가 잘 되고 있지만 안드로이드만 안된다.또 ,,, 안드로이드 배포는 targetSdkVersion을 34 이상으로 해야한다고 한다. **중요 *2024년 9월 2일 작성Adnroid 14 이상부터 사진/동영상 일부 접근 권한 (사진/동영상의 일부 접근 권한) 추가AndroidManifest.xmldartvoid imagePicker(String call) async { final picker = ImagePicker(); final XFile? pickedFile = await picker.pickImage(source: ImageSource.gallery); if ..

1. 기존 코드안드로이드는 추가해놓고 iOS는 파일 다운로드 기능을 추가하지 않았다..Future _startFileDownload( String url, String fileName, String accessToken) async { try { final directory = await getApplicationDocumentsDirectory(); String saveDirPath = directory.path; if (Platform.isAndroid == true) { saveDirPath = await ExternalPath.getExternalStoragePublicDirectory( ExternalPath.DIRECTORY_DOWNLOADS);..

1. 안드로이드"보안정책에 따라 화면을 캡처할 수 없어요." 토스트 메시지가 표출되면서 캡쳐 불가능하도록 구현main.dart@overrideinitState() { super.initState(); //스크린샷 방지 if (Platform.isAndroid) { FlutterWindowManager.addFlags(FlutterWindowManager.FLAG_SECURE); } ...(코드생략) }2. iOSiOS는 캡쳐 자체를 막을 수 는 없기 때문에 스크린샷이 감지되었다는 토스트 메시지가 출력되는게 기본적이지만,그것마저도 되지 않게 검은색 화면으로 캡쳐되도록 구현AppDelegate.swiftimport UIKitimport Flutterimport..

1. header에 변수 추가1. header.html 2. header 적용다른 html에 header 적용 방법2. script에 변수 추가

1. th:ifth:if="${session.name} != null" th:text="|${session.name} 님|"th:if="${session.name} == null" th:text="Login"2. th:if - th:unlessth:if="${session.name} != null" th:text="|${session.name} 님|"th:unless="${session.name} != null" th:text="Login"3. html 속성 조건문으로 추가1) th:attrth:attr : HTML 요소에 속성을 추가하거나 변경하는 데 사용되는 속성HTML 속성뿐만 아니라, CSS 스타일 및 데이터 속성도 포함th:attr="속성명=${조건 ? true일 경우 : false일 경우}"t..

item.oid의 item은 th:each를 사용한 반복문을 통해 가져온 변수명이다.1. 함수에 변수 추가js의 functionth:onclick="함수명([[${파라미터명.value값}]])"1-1. htmlDelete1-2. java scriptfunction deleteOrder(oid){ if(confirm("삭제하시겠습니까?")){ location.href='/deleteOrder?oid=' + oid; }}2. location.href에 변수 추가controller의 mapping url로 이동th:onclick="|location.href='@{html이름(파라미터명=${value값})}'|"2-1. html2-2. Controller.java@PostMapping("..