카테고리 전체101 [인프런 강의] zerocho Slack 클론 코딩 (11) - 로그인 페이지 만들기 [인프런 강의] zerocho Slack 클론 코딩 (11) - 로그인 페이지 만들기 이번 시간에는 로그인 페이지를 구현 하도록 한다. SPA상에서 태그를 사용하면 화면이 새로고침이 되는 문제가 발생한다. 따라서 React-router의 Link 태그를 사용하면 SPA가 유지된다. 로그인하는 컴포넌트를 다음과 같이 작성한다 /aleacture/Login/index.tsx import useInput from '@hooks/useInput'; import { Success, Form, Error, Label, Input, LinkContainer, Button, Header } from '@pages/SignUp/styles'; import fetcher from '@utils/fetcher'; impor.. 2022. 12. 9. 13:48 React-activate 사용 중 'decorators-legacy' 오류 문제 상황 개발 도중 캐시를 구현하기 위해 React-activate 라이브러리를 사용하던 도중 @withActivation 어노테이션을 추가하니 Support for the experimental syntax 'decorators-legacy' isn't currently enabled (33:1): 와 같은 에러가 발생하였다. 해결 방법 해결 한 방법은 다음과 같다. 1. package-json의 babel ["@babel/plugin-proposal-decorators", { "legacy": true }] 을 추가해준다. "babel": { "presets": [ "react-app" ], "plugins": [ "react-hot-loader/babel", ["@babel/plugin-propo.. 2022. 12. 8. 14:58 [Next.js] CORS 오류 해결방법, Next proxy 설정 Next를 사용하여 외부 Open API를 연동하려 하였더니 CORS 오류가 났다. CRA 환경에선 package.json 에서 proxy 설정만 하면 해결되었던 문제였는데 Next 환경에서는 어떻게 해결해야하는 지 몰랐다. 그래서 찾아보고 오류를 해결해 본 방법들을 기록해보려 한다. 오류 내용 Access to XMLHttpRequest at [OPEN API URL] from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. 2022.10.08 - [개발/네트워크] - [NetWork] CORS(Cr.. 2022. 11. 30. 17:30 [Jenkins] GitLab webhook 등록 시, Hook executed successfully but returned HTTP 403 Error 및 webhook 등록 방법 Hook executed successfully but returned HTTP 403 Error 오류 오류 상황 GitLab과 Jenkins 연동 시 다음 이미지와 같이 Hook executed successfully but returned HTTP 403 Error 가 발생하였다. Git push 이후 Jenkins를 자동으로 빌드시켜주는 webhook 등록을 하려 하였는데, 이를 등록하고, 테스트를 해보는데 아래와 같은 오류가 지속적으로 발생되었다. 맨 처음 Webhooks를 등록할때 url에 어떤 값을 넣어야 하고 Secret token은 Jenkins에서 어디에서 생성해서 입력해야 하는지 를 알지 못하였다. 위의 오류는 내가 Jenkins에 URL을 제대로 등록해주지 않아 발생한 오류였다. Je.. 2022. 11. 23. 16:09 Jenkins와 CI/CD 최근 서비스를 빌드하는 데 대해서 많은 고민을 한 것 같다. 처음으로 빌드 자동화 도구인 Jenkins를 알아보며, 회사 프로젝트 내에서 기존 빌드 구축 방법과 달리 도입해보려는 시도도 하려 한다. 그래서 나도 개인적으로 스터디가 필요하여 이론 -> 실습 순으로 정리해보려 한다. 우선 Jenkins 공식 홈페이지에 대한 내용을 정리해보려 한다. Jenkins는 아래의 홈페이지로 접속할 수 있다. https://www.jenkins.io/ Jenkins We are excited to announce the 2022 Jenkins Governance Board elections! The nomination and voter registration period is now open. Nominations c.. 2022. 11. 23. 01:57 Next + RTK + Typescript 개발 환경 설정하기 Next + RTK + Typescript 개발 환경 설정 Next.js 와 RTK를 연동하여 사이드 프로젝트를 하려 하는데 레퍼런스들이 좀 각자 개별로 달라서 내가 따로 정리해보려고 포스팅을 적는다. Next.js , Redux Next.js는 서버에서 서버사이드 렌더링을 하기 위한 라이브러리이기 때문에 서버에서 돌아가지만, Redux는 클라이언트(브라우저) 전역 상태 라이브러리기 때문에 브라우저 상에서 동작하게 된다. 원래 리액트 앱에서 리덕스를 사용하게 되면 단 하나의 리덕스 스토어만 존재하게 되지만, Next를 사용하게 되면 리덕스 스토어가 여러개가 생기는 문제가 생긴다. 그래서 Next와 redux를 같이 사용하려면 next-redux-wrapper 라이브러리를 사용해야한다. https://gi.. 2022. 11. 18. 01:45 이전 1 2 3 4 5 6 7 ··· 17 다음 728x90
