본문 바로가기

전체 글252

[02] JSON server로 Mock data서버 실행하여 React Query로 호출 JSON server 로 Mock data서버 실행하여 React Query로 호출하기 - 02 [01] JSON server 세팅 1. Mock 데이터 파일 생성 2. json-server 설치 3. 실행 script 추가 4. 서버 실행 [02] React Query를 사용하여 데이터 호출 5. axios 설치 6. React Query 설치 7. 추가 8. 데이터 호출 * 굳이 React Query로 호출 할 필요가 없으나, 라이브러리 세팅이 잘 되었는지 확인 겸. 겸사겸사 React Query로 데이터를 GET 해보았습니다. [02] React Query를 사용하여 데이터 호출 5. axios 설치 npm i axios https://www.npmjs.com/package/axios axios P.. 2024. 1. 17.
[01] JSON server로 Mock data서버 실행하여 React Query로 호출 JSON server 로 Mock data서버 실행하여 React Query로 호출하기 - 01 [01] JSON server 세팅 1. Mock 데이터 파일 생성 2. json-server 설치 3. 실행 script 추가 4. 서버 실행 [02] React Query를 사용하여 데이터 호출 5. axios 설치 6. React Query 설치 7. 추가 8. 데이터 호출 [01] JSON server 세팅 1. Mock 데이터 파일 생성 /mockdata.json "memo": [ { "id": 1, "title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit", "body": "quia et suscipit\.. 2024. 1. 17.
React 18 + tailwindcss 세팅 (eslint, prettierrc) 라이브러리 설치 CRA, react-dom설치 # CRA + typescript npx create-react-app inflinker-v3-front --template typescript # react-dom 추가 npm i --save react react-dom typescript Tailwind 설치 #Tailwind CSS 설치, 세팅파일 npm install -D postcss autoprefixer npx tailwindcss init npm install -D postcss-import npm install postcss-nesting --save-dev 컴포넌트 라이브러리 등등 설치 # React-Select 설치 # npm i --save react-select eslint, pret.. 2024. 1. 15.
[XAML] Label 컨트롤 CefSharp https://cefsharp.github.io/ CefSharp : Chromium Embedded Framework(CEF)를 기반으로하는 웹 브라우저 컨트롤 HTML5, JS, CSS3 및 PDF 지원 XAML 확장 응용 프로그램 마크업 언어 (Extensible Application Markup Language) https://docs.microsoft.com/ko-kr/dotnet/desktop/wpf/xaml/?view=netdesktop-6.0 Label 컨트롤 관련 컨트롤에 focus 부여 key값으로 접근 가능 게임 런처 버전을 표시하는 텍스트 UI를 Label컨트롤이 적용된 소스로 전달 받았는데, 해당 텍스트가 출력되지 않았다. // 오류코드 // Label 컨트롤에 C.. 2023. 12. 14.
궁극의 동계 워크숍 (AGF2023에서 팀장님 생파한 썰) 🔮 BGM으로 들을 노래 하나 추천하고 시작 🎵 플랫폼팀의 비공식 동계 워크숍 AGF2023 Anime x Game Festival 2023 AGF는 애니메이션과 게임을 메인으로 폭넓은 콘텐츠를 소개하는 국내 최대 규모의 공식 종합 이벤트입니다. 각종 전시 및 팝업 스토어, 유명 아티스트의 무대 행사, 애니와 게임을 모티브로 한 www.agfkorea.com 조지사마(팀장님)의 생일파티🎉 겸 소소한 연말행사로 국내 최대 서브컬쳐 페스티벌 AGF에 다녀온 플랫폼티무. (저는 개인 사정으로 불참했고, 팀원들의 사진을 모아 정리해보기로 했습니다.) 모든 비용은 조지사마가 Flex💸 맨 앞자리에가서 로젤리아 파이어버드 같이 불렀다는 조지사마 ✨ 포토존들 ✨ \ 🔮 다음 곡 추천 🎵 올해에 빠질 수 없는 텐사이테.. 2023. 12. 5.
[VSCode/ESLint] Delete `CR` eslint(prettier/prettier) 에러 git pull을 받았는데 돌연 등장한 에러 Delete `CR` eslint(prettier/prettier) 개행에 문제가 생긴듯 하다. 개행을 수동으로 제거해봤는데 원복되면서 에러가 사라지지 않았다. prettier규칙을 수정해야한다. 1. pagkage.json의 "eslintConfig"에 "rules"을 추가해준다. 추가할 룰 "eslintConfig": { ... "rules": { "prettier/prettier": [ "error", { "endOfLine": "auto" } ] } }, 적용이 되지 않았다. 2. .eslintrc.js 파일이 별도로 있는 경우는 그 파일 내에 작성해야한다고 한다. rules 추가 rules: { 'prettier/prettier': [ 'error',.. 2023. 12. 5.
[HTML]오디오 재생 시 재생 중인 다른 오디오 정지 (HTML Audio DOM) 🔊 오디오 재생 let track = new Audio(); let flag = 0; // flag를 사용하여 재생 중인 오디오 있으면 정지 const playVoice = (audioSrc) =>{ track.src = audioSrc; console.log(track.paused) if(flag === 0){ flag = 1; playAudio(); }else{ flag = 0; stopAudio() } } const playAudio = () => { track.play(); track.paused = false iconAnimation("play"); } const stopAudio = () => { track.pause(); track.currentTime = 0; iconAnimation("s.. 2023. 12. 1.