172만명의 커뮤니티!! 함께 토론해봐요.
미해결
[리뉴얼] React로 NodeBird SNS 만들기
안녕하세요! 갑자기 로컬호스트에 접속이 안 되어서 질문합니다 npm run dev 하면 컴파일까지는 성공하는데 그 다음에 localhost 로 접속하면 다음과 같은 에러가 뜹니다 error - ./node_modules/worker-farm/lib/fork.js:3:0 Module not found: Can't resolve 'child_process' null Error from chokidar (C:\): Error: EBUSY: resource busy or locked, lstat 'C:\DumpStack.log.tmp' Could not find files for / in .next/build-manifest.json (중간중간에 콘솔로그 찍힌건 생략했습니다) 개발자도구 확인해보면 에러는 안 나옵니다 구글링해서 package.json 수정하는 방법이랑 _document.js에 import 'classlist.js' 하는방법 시도해봤는데 오류가 해결되지 않았습니다.. 어떻게 해야할까요ㅠ
react redux node.js express next.js
sscapstondesign3
2023-12-03T08:27:20.564Z
댓글 1
좋아요 0
조회수 1222
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
강의에 나온 백엔드 주소랑 강의 자료의 34.64.135.149 주소가 다릅니다 어떤 주소가 맞는지요? 둘 다 적용해도 접속이 안됩니다. 또한 port번호는 어떤 걸 사용해도 상관 없나요?
react node.js seo graphql next.js
2023-12-03T05:31:50.352Z
댓글 1
좋아요 0
조회수 473
미해결
[리뉴얼] React로 NodeBird SNS 만들기
넥스트는 12버전 사용하고 있습니다. 빌드 할 때 보통 시간이 20초 정도 걸리나요? 새로고침하면 20초 정도 계속 걸려서 테스트하기가 참.. 힘드네용..ㅜ
react redux node.js express next.js
욱둥이
2023-12-01T23:42:28.298Z
댓글 1
좋아요 0
조회수 235
해결됨
김영한의 실전 자바 - 기본편
안녕하세요 영한님! 궁금한 점은 OCP 원칙까지 보고나서 생겨난 질문입니다. Car 인터페이스를 구현하는 K3Car, Model3Car, NewCar의 클래스, Driver는 Car인터페이스를 의존하고 있는데요.,,. 강의 내용과 같이 Car 인터페이스에 있는 추상메소드들만 구현한 클래스끼리 있을 때는 크게 어려운 점이 없는 것 같지만.,., 위와 같이 NewCar에서 이 때까지 없었던 pressBrake()라는 기능을 새로 추가하여 Driver에게 해당 메소드를 사용하게 하고싶다면! 어떻게 코드를 짜야하는지 가 저의 궁금증입니다! 먼저 코드를 짜보면서 혼자 해결해보려고 했으나,.., 자바와 아직 완벽히 친해지지 못했는지 더 좋은 방법이 있지 않을까 하며 만족스러운 해법을 찾지 못 하고 있습니다.. 1. Driver 클래스의 drive() 메서드 블록 안에서 instanceof를 사용하여 car변수가 NewCar 클래스일 때 pressBrake()를 사용한다면? 강의에서 배웠던 OCP원칙 중 Closed for modification에 모순이 생겨버리고.. 2. Car 인터페이스에 pressBrake() 메서드를 넣는다면? OCP 원칙에 모순이 생길 뿐더러 오히려 대대적인 코드 수정도 생겨버립니다.. 해당 사항에 대해서는 어떻게 대처를 해야 잘했다고 소문이 날지 궁금하여 질문을 올리게 되었습니다!
박정현
2023-12-01T14:05:26.696Z
댓글 1
좋아요 4
조회수 554
미해결
[리뉴얼] React로 NodeBird SNS 만들기
ubuntu@ip-172-31-45-72:~/TwitterClone-FS-/front$ npm run build > react-nodebird-front@1.0.0 build > cross-env ANALYZE=true NODE_ENV=production next build Linting and checking validity of types .. ⨯ ESLint: ESLint configuration in .eslintrc is invalid: - Unexpected top-level property "parseOptions". ✓ Linting and checking validity of types Disabled SWC as replacement for Babel because of custom Babel configuration ".babelrc" https://nextjs.org/docs/messages/swc-disabled Webpack Bundle Analyzer saved report to /home/ubuntu/TwitterClone-FS-/front/.next/analyze/nodejs.html No bundles were parsed. Analyzer will show only original module sizes from stats file. Webpack Bundle Analyzer saved report to /home/ubuntu/TwitterClone-FS-/front/.next/analyze/edge.html Using external babel configuration from /home/ubuntu/TwitterClone-FS-/front/.babelrc ⚠ It looks like there is a custom Babel configuration can be removed : ⚠ Next.js supports the following features natively: ⚠ - 'styled-components' can be enabled via 'compiler.styledComponents' in 'next.config.js' ⚠ For more details configuration options, please refer https://nextjs.org/docs/architecture/nextjs-compiler#supported-features Creating an optimized production build ... 계속 빌드를 진행하고있는데, ⨯ ESLint: ESLint configuration in .eslintrc is invalid: - Unexpected top-level property "parseOptions". 이부분, 통과못해도 계속해서 빌드가 진행되나요!? 아니면, 이부분때문에 지금 계속 빌드를 못하고 있는걸까요? 평균적인 빌드시간을 알고 싶습니다.
react redux node.js express next.js
김용민
2023-12-01T13:53:19.838Z
댓글 2
좋아요 0
조회수 478
미해결
[리뉴얼] React로 NodeBird SNS 만들기
ubuntu@ip-172-31-45-72:~/TwitterClone-FS-/front$ npm install npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@faker-js/faker@8.3.1', npm WARN EBADENGINE required: { node: '^14.17.0 || ^16.13.0 || >=18.0.0', npm: '>=6.14.13' }, npm WARN EBADENGINE current: { node: 'v12.22.9', npm: '8.5.1' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: 'next@13.5.6', npm WARN EBADENGINE required: { node: '>=16.14.0' }, npm WARN EBADENGINE current: { node: 'v12.22.9', npm: '8.5.1' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: 'styled-components@6.1.1', npm WARN EBADENGINE required: { node: '>= 16' }, npm WARN EBADENGINE current: { node: 'v12.22.9', npm: '8.5.1' } npm WARN EBADENGINE } up to date, audited 421 packages in 3s 105 packages are looking for funding run `npm fund` for details 1 high severity vulnerability To address all issues (including breaking changes), run: npm audit fix --force Run `npm audit` for details. ubuntu@ip-172-31-45-72:~/TwitterClone-FS-/front$ npm run dev > react-nodebird-front@1.0.0 dev > next /home/ubuntu/TwitterClone-FS-/front/node_modules/next/dist/lib/picocolors.js:134 const { env, stdout } = ((_globalThis = globalThis) == null ? void 0 : _globalThis.process) ?? {}; ^ SyntaxError: Unexpected token '?' at wrapSafe (internal/modules/cjs/loader.js:915:16) at Module._compile (internal/modules/cjs/loader.js:963:27) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10) at Module.load (internal/modules/cjs/loader.js:863:32) at Function.Module._load (internal/modules/cjs/loader.js:708:14) at Module.require (internal/modules/cjs/loader.js:887:19) at Module.mod.require (/home/ubuntu/TwitterClone-FS-/front/node_modules/next/dist/server/require-hook.js:64:28) at require (internal/modules/cjs/helpers.js:74:18) at Object.<anonymous> (/home/ubuntu/TwitterClone-FS-/front/node_modules/next/dist/build/output/log.js:55:21) at Module._compile (internal/modules/cjs/loader.js:999:30) ubuntu@ip-172-31-45-72:~/TwitterClone-FS-/front$ ls components next.config.js package-lock.json pages sagas utils hooks node_modules package.json reducers store ubuntu@ip-172-31-45-72:~/TwitterClone-FS-/front$ 이런 에러가 발생됩니다. unexpected token '?' 어떤 이유로 에러가 발생하고, 어떤식으로 해결해야지 실행할 수 있는지 알 고 싶습니다!!
react redux node.js express next.js
김용민
2023-12-01T10:41:34.972Z
댓글 1
좋아요 0
조회수 1108
미해결
실전! 스프링 부트와 JPA 활용2 - API 개발과 성능 최적화
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 여기에 질문 내용을 남겨주세요. EventGroupInformation.java @NotFound(action = NotFoundAction. IGNORE ) @JsonBackReference @ManyToOne(cascade = CascadeType. PERSIST , fetch = FetchType. LAZY ) @JoinColumn(name="CATEGORY_ID", insertable = false, updatable = false) private CategoryInformation categoryInformation; @BatchSize(size = 1000) @JsonManagedReference @OneToMany(mappedBy = "eventGroupInformation", cascade = CascadeType. PERSIST , fetch = FetchType. LAZY ) @Where(clause = "DBSTS = 'O' AND FEED_DISPLAY_YN = 'Y' AND START_DATE <= SYSDATE AND END_DATE >= SYSDATE ") @Column(insertable = false, updatable = false) private List<EventInformation> eventInformations; CategoryInformation.java @BatchSize(size = 1000) @JsonManagedReference @OneToMany(mappedBy = "categoryInformation", fetch = FetchType. LAZY ) @Where(clause = "DBSTS = 'O' AND START_DATE <= SYSDATE AND END_DATE >= SYSDATE ") @Column(insertable = false, updatable = false) //@Access(val ue = AccessType.PRO PERTY) public List<EventGroupInformation> eventGroupInformations; 여러개의 oneToMany가 걸려 있는 entitiy들을 강의 V5예제를 참고하여 개선중에 있습니다. CategoryInformation(Order) ㄴ EventGroupInformation(OrderItem) ㄴ EventInformation(Item) 이런 식에 구조인데요, 각각 oneToMany 입니다. EventGroupInformation과 EventInformation을 fetchJoin을 통해 쿼리를 @Query(value = "SELECT distinct eg FROM EventGroupInformation eg " + "LEFT JOIN FETCH eg.eventInformations e " + "WHERE eg.dbsts = :dbsts " + "AND eg.categoryId IN :categoryIds" ) 호출하면 해당 fetchjoin 쿼리 하나만 나갈꺼라고 생각을했는데, 갑자기 상위 entity인 CategoryInformation 테이블에 category_id(PK)로 category_id 개수만큼의 N+1 이슈가 발생 하였습니다. JsonBackReference, JsonManagedReference 해당 옵션을 주면 역참조가 안되어야 하는게 맞지 않나요?? 추가로 ManyToOne 쪽에 @JsonIgnore 도 추가 해보았으나 마찬가지입니다 ㅠ 제가 놓치고 있는게 있을까요? 김영한 선생님 강의 에서는 OrderItem-Item 관계에서 IN쿼리를 호출했을때 IN절에 포함되는 orderId기준의 상위 엔티티인 Order 테이블에 역으로 쿼리가 나가는건 못봤는데 말이죠.. (물론, 양방향 관계를 끊고 단방향 설정시 N+1 쿼리는 나가지 않습니다.)
김정훈
2023-12-01T06:49:25.146Z
댓글 2
좋아요 1
조회수 608
미해결
[리뉴얼] React로 NodeBird SNS 만들기
문제가 몇일째 안풀리는게 있어 문의드려요 제가 next-auth를 사용해서 로그인 프로세스를 해보고 있습니다. 로컬에서 별도로 배포환경 만들어서 테스트를 했을 때에는 잘 되는데 배포시에 계속 Unauthorized 에러가 발생해서요 제가 작성한 [...nextauth].ts 코드입니다. import NextAuth, { User } from 'next-auth'; import CredentialsProvider from 'next-auth/providers/credentials'; import { refreshAccessToken } from 'utils/tokenRefresh'; export default NextAuth({ providers: [ CredentialsProvider({ name: 'Credentials', credentials: { userId: { label: 'UserId', type: 'text', placeholder: 'jsmith' }, password: { label: 'Password', type: 'password' }, }, authorize: async (credentials) => { const res = await fetch(`${process.env.NEXT_PUBLIC_BACKEND_URL}/api/v1/users/signin`, { method: 'POST', body: JSON.stringify({ userId: credentials!.userId, password: credentials!.password, }), headers: { 'Content-Type': 'application/json' }, }); const user = await res.json(); // 로그인 성공 시 사용자 객체를 반환하고, 실패 시 null을 반환 if (res.ok && user) { console.log('ok user', user); return user; } else { console.log('error user', user); return false; } }, }), ], secret: process.env.NEXTAUTH_SECRET, // session: { // strategy: 'jwt', // maxAge: 0, // 브라우저가 닫히면 세션 종료 // // updateAge: 24 * 60 * 60, // 24시간마다 세션 갱신 (옵션) // }, callbacks: { async jwt({ token, user }) { // 사용자 로그인 시 토큰 설정 if (user) { return { ...token, accessJwt: user.result?.accessJwt, refreshJwt: user.result?.refreshJwt, companyId: user.result?.companyId, userName: user.result?.userName, accessTokenExpires: Date.now() + 3600 * 1000, }; } // 토큰 만료 확인 및 리프레시 if (Date.now() > token.accessTokenExpires!) { const newAccessJwt = await refreshAccessToken(token.refreshJwt!); return refreshAccessToken(newAccessJwt); } return token; }, async session({ session, token }) { if (token && token.accessJwt) { const customUser = session.user as User; if (!customUser.result) { customUser.result = { accessJwt: '', refreshJwt: '', companyId: '', userName: '', }; } customUser.result.accessJwt = token.accessJwt; customUser.result.refreshJwt = token.refreshJwt; customUser.result.companyId = token.companyId; customUser.result.userName = token.userName; session.user = customUser; } return session; }, }, }); NEXT_PUBLIC_BACKEND_URL 환경변수는 별도의 백엔드를 구성한 주소이구요 배포는 도커를 사용했습니다. FROM node:20.10 as builder # pnpm 설치 RUN npm install -g pnpm WORKDIR /usr/src/app COPY package*.json ./ RUN pnpm install ARG NEXT_PUBLIC_BACKEND_URL ARG NEXTAUTH_SECRET COPY . . RUN NEXT_PUBLIC_BACKEND_URL=https://${NEXT_PUBLIC_BACKEND_URL} NEXTAUTH_SECRET=${NEXTAUTH_SECRET} pnpm run build FROM node:20.10 RUN npm install -g pnpm WORKDIR /usr/src/app COPY --from=builder /usr/src/app/package*.json ./ RUN pnpm install --prod COPY --from=builder /usr/src/app . # COPY --from=builder /usr/src/app/.next ./.next EXPOSE 3000 CMD ["pnpm", "run", "dev"] NEXTAUTH_SECRET은 프론트 주소를 도커 실행 시 넣어줘야 한대서 도커 실행 할 때 환경변수로 따로 넣어줬구요 Docs, Stackoverflow, ChatGPT 등 여러 방면으로 찾아봤는데 해결이 안되더라구요.. 강의하고는 별개 내용이긴 한데 더이상 물어볼 데가 없어서 강사님께 여쭈어봅니다..
react redux node.js express next.js next-auth docker
2023-12-01T00:17:27.704Z
댓글 2
좋아요 0
조회수 773
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
이렇게 갈색으로 뜨는데, 에러가 되는 이유가 이 때문인 것 같아요. 무슨 이유 때문에 그럴까요? ㅠㅠㅠ
react node.js seo graphql next.js
uri
2023-11-30T11:49:22.614Z
댓글 1
좋아요 0
조회수 380
미해결
윤재성의 자바 기반 안드로이드 앱개발 Part 1 - UI Programming
강의 22분 35초 경 switch-case 문을 통해 체크박스의 id로 분기를 하려고 할 때 // id로 분기함 switch (checkboxId) { case R.id.checkBox: break; case 문의 R.id .checkBox 부분에서 "Constant expression required" 에러가 발생합니다. 구글링을 해보니 switch-case 문의 상수가 final로 선언되지 않아 발생하는 문제라고 하는데 어떻게 해결할 수 있을까요?
bumseok123
2023-11-30T11:19:11.670Z
댓글 1
좋아요 0
조회수 3728
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
위는 선생님 파일 다운로드 한거의 package.json 이거는 제 포폴 의 package.json 입니다 ts-node 라든지 devDependencies에서도 빠진 게 몇개 있어보이는데.. 터미널에서 뭘 설치해야 할까요?? 수업 코드에서도 똑같이 설치한것같은데 types.ts 내용이 다르더라구요. ㅠㅠ 이건 수업 코드 내의 package.json 입니다 별 다를 건 없어 보입니다.. 근데 둘다 types.ts 내부 내용들이 누락된 게 너무 많더라구요 설치는 똑같이 한 거 같은데 버전 문제일까요? (types.ts) 이런식으로 많이 다릅니다.. (오른쪽이 수업코드) +추가질문 포트폴리오 파일인데 저런 오류가 뜹니다.. types.ts 에 누락된 내용이 많아서 그런걸까요?
react node.js seo graphql next.js
nyang
2023-11-30T09:09:26.195Z
댓글 2
좋아요 0
조회수 452
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
다른 공부하시는분들도 잘 적용됐는지 확인하는데 번거로움이 있을거 같아서 말씀드려요!
react node.js seo graphql next.js
손성오
2023-11-30T07:57:09.254Z
댓글 2
좋아요 0
조회수 209
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
제가 리액트, node.js의 RestAPI를 다루는 부분이 필요해서 수업을 듣게 되었습니다. (전체적인 리액트, node.js의 활용법도 필요함) 그런데 Graphql이란 것이 있어서 그 부분을 뛰어넘고 제가 필요한 부분만 들으려고 하니까 섹션 8과 9가 Graphql을 모르면 진행이 안되는 것 같더라고요. 이런 경우 실무에서도 이런 식으로 많이 쓰시는지, 점점 바뀌는 추세인 건지 궁금합니다.
react node.js seo graphql next.js
uri
2023-11-30T05:42:25.954Z
댓글 2
좋아요 0
조회수 336
미해결
김영한의 실전 자바 - 기본편
[static 메서드3] 강의 보고 질문드립니다. import static 으로 특정 클래스의 메서드 적용해서 메서드 사용하는 것과 클래스 .(dot) 찍고 메서드 사용하는 것 중 실무에서는 어떻게 사용하는 편이 좋은지 궁금합니다.
카드캡터솔쨩
2023-11-30T03:01:32.250Z
댓글 2
좋아요 0
조회수 458
해결됨
자바와 스프링 부트로 생애 최초 서버 만들기, 누구나 쉽게 개발부터 배포까지! [서버 개발 올인원 패키지]
안녕하세요 강사님먼저 첫번째 질문은 DTO (CalculatorMultiplyRequest request)를 매개변수로 받는 데, 자동으로 request 인스턴스가 생성되는 것이 이해가 가지 않습니다. 클래스는 생성자를 호출하기 위해서는 new키워드로 생성해야 하는 것으로 알고있는데, 이해가 잘 되지 않습니다.두번째 질문은 GET요청과는 다르게 POST요청은 Request 클래스 내부에 생성자 없이도 number1과 number2에 값이 할당되는 점입니다.어떻게 이게 가능할 수 있죠..?
java spring aws mysql spring-boot jpa
mayo3610
2023-11-30T01:33:18.390Z
댓글 1
좋아요 6
조회수 634
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
안녕하세요 질문 있습니다! refetchQueries 적을 때 자동완성되는 익스텐션이 뭔지 알 수 있을까용?
react node.js seo graphql next.js
yoonseong
2023-11-29T19:43:42.100Z
댓글 2
좋아요 1
조회수 242
미해결
자바 ORM 표준 JPA 프로그래밍 - 기본편
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 여기에 질문 내용을 남겨주세요. <property name="hibernate.hbm2ddl.auto" value="update"/> create / create-drop 은 잘 됩니다. 하지만 update는 이상한점을 발견을 했습니다. 이유를 알고 싶어서 이런 질문 드립니다. update를 value에 작성을 한뒤에 Member class 에서 A - private int age x B - private Integer o 위 와 같이 작성을 하고 나서 실행을 해보면 A는 오류가 발생하지만 B는 정상적으로 작동이 됩니다. 이유를 알려주세요.
chewjob99
2023-11-29T16:09:13.499Z
댓글 1
좋아요 0
조회수 323
미해결
[리뉴얼] React로 NodeBird SNS 만들기
redux-saga 쪼개고 reducer 연결 하려고 하니 user reducer만 반응하고 LOG_IN_SUCCESS 는 반응을 하지 않습니다. 커뮤니티 게시판에서 여러가지를 확인해보고 해도 어디 부분이 잘못 된지 몰라 올려봅니다.. 제가 작성한 코드는 이러합니다. store/configureStore.js import { applyMiddleware, createStore, compose } from "redux"; import createSagaMiddleware from "redux-saga"; import { createWrapper } from "next-redux-wrapper"; import { composeWithDevTools } from "redux-devtools-extension"; import reducer from "../reducers"; import rootSaga from "../sagas"; const configureStore = (context) => { console.log("context", context); const sagaMiddleware = createSagaMiddleware(); const middlewares = [sagaMiddleware]; const enhancer = process.env.NODE_ENV === "production" ? compose(applyMiddleware(...middlewares)) // 배포용 : composeWithDevTools(applyMiddleware(...middlewares)); const store = createStore(reducer, enhancer); store.sagaTask = sagaMiddleware.run(rootSaga); return store; }; const wrapper = createWrapper(configureStore, { debug: process.env.NODE_ENV === "development", }); export default wrapper; reducers/index.js import { HYDRATE } from "next-redux-wrapper"; // HYDRATE = action import { combineReducers } from "redux"; import user from "./user"; import post from "./post"; const rootReducer = combineReducers({ index: (state = {}, action) => { switch (action.type) { case HYDRATE: console.log("HYDRATE", action); return { ...state, ...action.payload }; default: return state; } }, user, post, }); export default rootReducer; reducers/user.js export const initialState = { isLoggingIn: false, // 로그인 시도중 isLoggedIn: false, // 로그인 isLoggingOut: false, // 로그아웃 시도중 meUser: null, signUpData: {}, loginData: {}, }; export const LOG_IN_REQUEST = "LOG_IN_REQUEST"; export const LOG_IN_SUCCESS = "LOG_IN_SUCCESS"; export const LOG_IN_FAILURE = "LOG_IN_FAILURE"; export const LOG_OUT_REQUEST = "LOG_OUT_REQUEST"; export const LOG_OUT_SUCCESS = "LOG_OUT_SUCCESS"; export const LOG_OUT_FAILURE = "LOG_OUT_FAILURE"; export const loginRequestAction = (data) => ({ type: LOG_IN_REQUEST, value: data, }); export const logoutRequestAction = () => ({ type: LOG_OUT_REQUEST, }); const reducer = (state = initialState, action) => { // prettier-ignore switch(action.type) { case LOG_OUT_REQUEST : return {...state, isLoggingIn : true}; case LOG_IN_SUCCESS : return {...state, isLoggingIn : false, isLoggedIn:true, meUser:{...action.value, nickName:"Jay"}}; case LOG_IN_FAILURE : return {...state, isLoggingIn : false, isLoggedIn:false }; case "LOG_OUT_REQUEST" : return {...state, isLoggingOut:true}; case "LOG_OUT_SUCCESS" : return {...state, isLoggingOut:false, isLoggedIn:true, meUser:null}; case "LOG_OUT_FAILURE" : return {...state, isLoggingOut:false}; default: return state; } }; export default reducer; sagas/index.js import { all, fork, call } from "redux-saga/effects"; import userSaga from "./user"; export default function* rootSaga() { yield all([fork(userSaga)]); } sagas/user.js import { all, fork, put, delay, takeLatest } from "redux-saga/effects"; import { LOG_IN_FAILURE, LOG_IN_REQUEST, LOG_IN_SUCCESS, } from "../reducers/user"; function* logIn(action) { try { console.log("saga logIn"); // const result = yield call(logInAPI); yield delay(1000); yield put({ type: LOG_IN_SUCCESS, value: action.value, }); } catch (err) { console.error(err); yield put({ type: LOG_IN_FAILURE, error: err.response.data, }); } } function* watchLogIn() { yield takeLatest(LOG_IN_REQUEST, logIn); } function* watchLogOut() { yield takeLatest("LOG_OUT_REQUEST"); } export default function* userSaga() { yield all([fork(watchLogIn), fork(watchLogOut)]); }
react redux node.js express next.js
jaeyong Kim
2023-11-29T05:03:31.443Z
댓글 2
좋아요 0
조회수 496
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
event.target 에 왜 id 가 없다 나오는지 알고 싶습니다
react node.js seo graphql next.js
손성오
2023-11-28T19:26:59.710Z
댓글 1
좋아요 0
조회수 417
미해결
[리뉴얼] React로 NodeBird SNS 만들기
리트윗 에러시, alert를 띄워주실 때, 게시글 . 수만큼 리렌더링이 발생하셔서 index.js 상위 페이지로 에러를 올려주셨는데, 설명하실떄 리트윗 에러에다가, 게시글 id까지 같이 넣어서, 그. 포스트 카드에만 에러메시지가 나오게 해서 해결하실 수있다고 하셨습니다. 어떤식으로 코드를 작성하면 되는지 해당 부분에 대한 코드 작성법도 알고싶습니다. 어떤식으로 postId를 넘겨주고 useEffect를 활용할 수 있는지 알고 싶습니다. function retweetAPI(data) { return axios.post(`/post/${data}/retweet`); } function* retweet(action) { try { const result = yield call(retweetAPI, action.data); yield put({ type: RETWEET_SUCCESS, data: result.data, }); } catch (err) { console.error(err); yield put({ type: RETWEET_FAILURE, error: err.response.data, }); } }
react redux node.js express next.js
김용민
2023-11-28T09:27:55.065Z
댓글 1
좋아요 0
조회수 280
