trouble shooting35 [laravel]select where 조건으로 bcrypt암호화한 값을 넣었을때 TParentUser::select('F_EMAIL', 'F_PASSWORD') ->where('F_EMAIL', $request->F_EMAIL) ->where('F_PASSWORD', bcrypt($request->F_PASSWORD)) ->first(); 해당 쿼리문을 수행 했을때 null값이 반환됐다. DB에서 쿼리문을 수행했을때는 문제가 없었다. 이유는 Eloquent 쿼리에서 bcrypt로 암호화한 비밀번호를 검색하려고 했기 때문이라고 한다. bcrypt 함수는 해시된 비밀번호를 검색할 때 사용하는 것이 아니며, Eloquent에서 사용하려면 일반 비밀번호와 일치하는 비밀번호를 사용해야 한단다. password_verify 함수를 사용하여 입력한 비밀번호와 데이터베이스에서 가져온 해시된 비밀번.. 2023. 9. 11. 파이어베이스 댓글 단 글 리스트 불러오기 마지막 프로젝트 였던 거기어때의 백엔드 서버가 닫혀 firebase를 이용해 서비스를 할수있도록 리펙토링 중입니다. 그중 마이페이지 구현한 내용입니다. 마이페이중 댓글 단 글 리스트가 있다. 내가 쓴 글이나, 스크랩은 post에 있는 속성을 이용해 쿼리문에 조건만 주면되지만 지난번에 말했다 시피 파이어베이스에는 join기능이 없어 댓글 단 글을 불러오기가 아주 난감했다. 그렇다고 댓글도 post에 넣자니 한필드에 너무 많은 데이터가 들어갈 경우 나중에 불러올때 느려질수도 있겠다는 생각에 포기하고 댓글에 uid리스트를 만드는 방향으로 생각을 바꿨다. export const createComment = async (postID) => { const initComment = { comments: [], com.. 2023. 7. 31. 파이어베이스 + 리액트쿼리 + 무한스크롤 마지막 프로젝트 였던 거기어때의 백엔드 서버가 닫혀 firebase를 이용해 서비스를 할수있도록 리펙토링 중입니다. 그중 무한스크롤을 구현한 내용입니다. 기존의 무한 스크롤은 리액트 쿼리의 useInfiniteQuery훅을 사용하여 구현했었다. import { useInView } from "react-intersection-observer"; import { useInfiniteQuery } from '@tanstack/react-query'; const [ref, inView] = useInView(); const getSearchPosts = async (searchState, pageParam) => { const res = await postApis.searchPostAX(searchState,.. 2023. 7. 31. 이미지 업로드를 위한 파이어 스토리지 사용내용 마지막 프로젝트 였던 거기어때의 백엔드 서버가 닫혀 firebase를 이용해 서비스를 할수있도록 리펙토링 중입니다. 그중 이미지 업로드 관련 파이어 스토리지의 구현한 내용입니다. 글작성시 이미지 업로드를 위해 파이어베이스에 있는 기능중 하나인 파이어 스토리지를 사용했습니다. Firebase | Google’s Mobile and Web App Development Platform Discover Firebase, Google’s mobile and web app development platform that helps developers build apps and games that users will love. firebase.google.com 기존 파이어베이스의 빌드중 스토리지를 선택해 시작합니다... 2023. 7. 31. React AWS EC2 배포하기 여태것 vercel로 배포를 했었는데 vercel은 기본적으로 https로 배포가 된다. 그런데 back-end분들의 서버가 AWS의 EC2로 배포를 하시는데 해당 배포는 http로 배포가 된다. 그래서 API통신이 제대로 이루어지지않아 front에서 AWS의 EC2로 배포 해보기로 했다. AWS EC2에 웹 프로젝트 배포하기 (React) EC2 인스턴스 생성하기 터미널에서 EC2 인스턴스에 접속하기 웹 프로젝트 배포 하기 웹 프로젝트 배포 확인 리액트로 만든 웹페이지를 로컬 호스트 주소가 아닌 누구든 볼 수 있는 url로 변경하기 3d-yeju.tistory.com 이분의 블로그를 참고 했다. AWS 계정 가입후 EC2를 선택 합니다. 인스턴스 항목에서 인스턴스 시작으로 새로운 인스턴스를 만든다. 프.. 2022. 11. 3. React 다중 이미지 업로드 훅 리액트 이미지 업로드 or 리액트 이미지 다중 업로드를 검색 하면 글이 많이 나오는데 소스가 모두 제각각이고 설명이 이해하기 힘들어서 여기저기서 소스를 짜집기해서 기능을 구현하고 다음 프로젝트에서 사용하기위해 훅으로 뺐다. browser-image-compression 설치 npm i browser-image-compression browser-image-compression Compress images in the browser. Latest version: 2.0.0, last published: 7 months ago. Start using browser-image-compression in your project by running `npm i browser-image-compression`. T.. 2022. 11. 2. React Redux toolkit 미들웨어 이해하기 dispatch로 action을 보낼때 동기처리 방식인데 미들 웨어 개념을 이욯해 비동기 처리를 한다. 이해 했다고 생각 했는데 실제로 사용해 보니 이해를 못하고있었다... page에 진입시 api로 List를 받아와 state에 저장하고 body에 뿌려주는 로직을 구상했었다. useEffect에서 dispatch로 List를 받아와 body에 뿌려봤다. 그랬더니 state를 읽을수 없다고 했다. state의 초기 값은 없는데 그걸 읽고 있어서 그런거같다 순서가 어떻게 되는지 이해가 잘 안돼서 콘솔로 다찍어봤다. 바디가 먼저 호출 되서 List를 map을 돌려 값을 찾지 못하는 거였다... 하나하나 콘솔을 찍어보니 미들웨어의 동작방식을 직접 본 느낌이다. fulfiled상태일떄 body에 list를 뿌려.. 2022. 10. 26. redux-toolkit 콘솔에 상태값이 proxy로 찍힐때 리듀서에서 현재 상태를 콘솔로 찍었을때 proxy로 나왔다. 데브 툴에는 상태값이 있는것을 확인했다. 검색을 해볼걸 뻘짓만 엄청나게 했다. 해결법은 import { current } from "@reduxjs/toolkit"; console.log(current(state)) current를 사용하여 확인 할수 있었다. current current드래프트의 현재 상태에 대한 스냅샷을 찍고 이를 종료하는 라이브러리의 함수입니다 immer( 단 , 고정되지 않음). Current는 디버깅하는 동안 현재 상태를 인쇄하는 훌륭한 유틸리티이며 의 출력 current도 생산자 외부로 안전하게 누출될 수 있습니다. Other Exports | Redux Toolkit redux-toolkit.js.org Extra.. 2022. 10. 18. React실행 에러 클론이나 프로젝트를 복사해서 로컬에서 실행하려할때 PS C:\Users\mhh\OneDrive\바탕 화면\sparta\week3React\w5-todolist> npm start > w4-todolist@0.1.0 start > react-scripts start 'react-scripts'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다. 이런 에러가 난다면 react-scripts를 다시 설치해주면 된다. 설치 npm install or yarn install 설치후 다시 실행 해 보니 또 에러가 난다. 아마 이프로젝트에 필요한 라이브러리를 안깔아서 그런것같다. 다 깔고 다시 해보자. 설치 yarn add styled-components yarn add redux .. 2022. 10. 14. 이전 1 2 3 4 다음
