Travel to Frontend (372) 썸네일형 리스트형 Flutter homebrew 설치시 SDK 경로 찾는방법 안드로이드 스튜디오에 Flutter project를 열려고하니 경로를 입력해야한다고한다.A Flutter SDK must be specified for project creation.sdk를 사이트에서 직접 설치할경우에 해당 파일이 자동으로 열려 금방찾을수있으나 나의경우는 homebrew로 설치한경우라 경로를 못찾았다. 이럴때 flutter doctor을 이용하면 아주 유용하다.flutter docker는 현재 플러터 개발을위해 설치해야할 애들을 알려주는데 이와 더불어 어디에 설치됬는지도 알려준다.flutter doctor -v 나의 경우 아래 경로에 flutter가 설치되어있었다./opt/homebrew/Caskroom/flutter/3.27.4/flutter이제 프로젝트가 만들어졌다. git reflog 로컬에 남아있는 내코드 복구 함께작업할때 실수로 rebase를 안하고 습관처럼 git push -f를 해버려서 동료코드를 날려먹었다 ㅠ..원복하긴하였으나 내코드가 날라갔다 ㅋㅋ.. 로컬에 남아있을거라생각했는데 만약에 git log해도 내가짠 코드가 안보이면..?git flog를 사용해보자 Git flog란git에서 로컬저장소의 모든 HEAD 변경이력을 보여준다. 일반적으로 git log는 브랜치의 커밋히스토리만 보여주지만,reflog는 브랜치이동, 체크아웃, 병합, 리베이스, 커밋 취소등과 같은 모든 HEAD 변경기록을 추적한다. 이 기록은 로컬에서만 유지된다. git flog를 입력해서 해시코드 목록중에 내 해시코드를 찾았다면?git checkout {해시코드}로 이동한뒤에 실행해보면 내 코드가 살아있는것을 볼 수 있다.하지만 .. useState와 그 대체재 useRef useState에서 변경한 값이 바로변경되지 않는 이유React에서 useState의 상태 업데이트는 비동기로 처리된다.따라서 리렌더링을 완료하지않은경우 이전값을 가져오는 경우가 발생할 수 있어 주의가 필요하다. 반면 useRef는 값이 바뀌더라도 리렌더링과 관계없이 바로 참조할 수 있는 최신 값을 유지할 수 있다. 단순한 값의 저장 및 참조만 필요한 상황에서는 useRef를 고려하면좋다. useState를 사용하면서 상태 업데이트의 비동기 특성까지 고려하고싶다면, useEffect나 콜백함수 내부에서 상태를 참조하는 방식으로 수정 할 수있다. 의존성으로 추가하여 상태 변화 시 최신값을 참조하도록 한다. // useRef 대신 useState 사용const [listCount, setListCount] .. "url" parameter is valid but upstream response is invalid 에러 Nextjs에서 제공하는 Image 태그를 사용하려하니 엑박이미지와 함께 "url" parameter is valid but upstream response is invalid 에러메시지가 표시됬다. 하지만 img태그는 정상작동한다.. 뭐지?(200이고 클라이언트, 서버둘다 문제가 없어보임) next.config.js에서 도메인 설정은 잘되어있다. images: { formats: ['image/avif', 'image/webp'], remotePatterns: [ { hostname: 'www.....com', }, { hostname: '...cloudfront.net', }, ], }, 아래 깃헙 이슈에는 4.0버전에서부터 안된다고하는 유저가있는데 내 버전은 14.1.4이다.. Nextjs에서 현재.. PWA 아이폰 설치시 주의할점 iOS 기기에서는 Chrome 브라우저를 사용하여 PWA(Progressive Web App)를 설치하는 것은 불가능합니다. iOS 기기에서는 Safari 브라우저를 사용하여 PWA를 설치할 수 있습니다. 하지만 하단의 크롬북 링크에서는 가능하다고해서 추가 확인이 필요합니다. 잘못된 정보일경우 알려주세요. https://support.google.com/chromebook/answer/9658361?hl=ko&co=GENIE.Platform%3DiOS&oco=2 프로그레시브 웹 앱 사용하기 - iPhone/iPad - Chromebook 고객센터 도움이 되었나요? 어떻게 하면 개선할 수 있을까요? 예아니요 support.google.com Error [ERR_REQUIRE_ESM]: require() of ES Module 해결 Error [ERR_REQUIRE_ESM]: require() of ES Module /Users/yujin/caveduck/caveduck/proj.www/node_modules/json-with-bigint/json-with-bigint.js from /Users/.../node_modules/@qdrant/openapi-typescript-fetch/dist/cjs/fetcher.js not supported. Instead change the require of json-with-bigint.js in /Users/.../node_modules/@qdrant/openapi-typescript-fetch/dist/cjs/fetcher.js to a dynamic import() which is av.. fixed가 div안에서 넘칠때, 중앙정렬 방법 fixed를 적용하였더니 밖으로 튀어나오는 대참사가 벌어졌다. 상위 div에 relative를 넣어도 먹지않았는데 그 이유는 fixed는 viewport를 참조하기 때문이라고한다. left: 0; padding: 0 20px; width: 90%; right: 0; margin: 0 auto; 팝업의 상단이었기때문에 일정한 간격만 넣어주면되서 위처럼 코드를 작성하여 해결하였다. 이외 max-width값을 넣어서 일정크기이상부터는 고정하게하였다. + 추가 Fixed 버튼 중앙정렬 .fixed-button { position: fixed; bottom: 0; /* 화면 하단에 고정 */ left: 50%; /* 화면 중앙에 정렬하기 위해 왼쪽 50% 위치 설정 */ transform: translateX(-.. S3 업로드와 조회(HTTP get) 코드 샘플 S3 넣기 s3에 접근하기 위해서 aws-sdk라는 모듈이 필요하다. 한가지 주의할점은 await를 사용해야 s3에 온전히 넣을때까지 기다릴 수 있다. s3.upload(params)를 호출하면되는데 이때 params에 들어가는 옵션들을 확인해보자. params 옵션 * Bucket : s3에 만든 bucket이름을 넣는다. * Key : 해당 bucket에 넣을 폴더명을 입력한다. 데이터는 이곳 안에 들어간다. * Body : json 형태의 데이터가 들어간다. JSON.stringify() 처리를 해줘야한다. * ACL: ACL은 "Access Control List"의 약자로, AWS S3에서 객체(파일)에 대한 액세스 권한을 제어하기 위한 메커니즘이다. ACL은 S3 객체에 대한 여러 사용자 또는.. 이전 1 2 3 4 ··· 47 다음
