# next
[Next.js] 왜 Link 태그를 사용할 수 없죠? 삐빅 대소문자 문제입니다
<You should only use "next/router" inside the client side of your app.> & <There are multiple modules with names that only differ in casing.>
RIDI 입사자 과제 회고
3/16 일에 새로운 회사인 RIDI에 입사하게 되었다.새로운 환경에 적응하는 일은 늘 어려운 일이다. 특히 나 같은 경우는 먼저 다가가서 친해지는 성격도 아니고 은근히 내성적이기 때문에 약간 새로운 환경을 두려워하기도 한다.무튼 그러나 회사는 회사기 때문에 최대한 빠
NEXT HEAD 에 대하여
SSR(Server Side Rendering)의 가장 큰 장점 중에 하나는 바로 SEO(Search Engine Optimization)이다. 다양한 SEO 스킬들을 적용하기 위해서 서버로부터 <head>를 받을 수 있어야 한다. 이를 가능하도록 하는 것이 Ne
쪼렙 개발자의 NEST.js 입문기
React는 기본적으로 CSR(Client Side Rendering) Framework이다. 서버에서 기본 Html만 받아 Client에서 데이터를 구성하여 화면에 렌더링한다. 그래서 React Application 들은 SPA(Single Page Applicati
Next.js에 Redux-Saga 연결 해보기
Redux만으로는 비동기적인 작업을 처리하지 못 합니다. 그래서 미들웨어를 연결해서 비동기작업 처리를 하는 코드를 짜주어야 합니다. 대표적인 미들웨어로 thunk와 saga가 있는데 saga가 더 기능이 많고 많이 쓰이는 것 같아 saga로 해보도록 합니다.위 명령어를
2020-02-22 ~ 02-23 삽질
22일부터 23일까지의 삽질 및 생각을 적어본다DND 프로젝트 남은 기한이 1주일지 2주일지 잘 모르겠지만 최대한 열심히 해보려고 한다.현재 코로나 바이러스 때문에 밖에도 안 나가고 코딩 놀기 코딩 놀기만 반복중이다...흑흑ㅠㅠ주말동안 엄청 많은 작업은 하지 않았고 많
Next.js란?
Next.js는 React 앱을 쉽게 구축할 수 있게 하고 SSR을 쉽게 설정할 수 있게 하는 리액트 프레임워크다.공식문서 : https://nextjs.org/Next.js의 장점으로는 이렇게 적혀있다.직관적인 페이지 기반 라우팅 시스템(동적 경로 지원)가능
Next.js 동적 라우팅 SSR
이전에는 Next의 getInitialProps를 활용하여 기본적인 SSR을 해보았다. 이제는 동적라우팅으로 되어있는 페이지들을 SSR하게 만들어 볼 것이다. 그리고 styled-components가 처음에는 csr로 실행이 되어 css가 적용되지 않고 나타났다가 적용
2020-02-21 삽질
오늘도 DND 프로젝트를 이어서 했다. 오늘은 로그인 구현 및 메인페이지 정보들 불러오는 작업을 하였다. 우리 로그인은 jwt를 이용하여 하는데 지금 하는 방식이 좀 좋지 않은 방식이라는 생각이 들었다. 지금 React + spring boot로 이루어져있는데 클라이언
Next.js를 배우기전에...!
안녕하세요. thsoon입니다.이번에 포스팅이란걸 처음 써봐 부족한 뉴비지만 차근차근 써보도록 하겠습니다.포스팅을 시작하게 된 이유는 언제 한번 블로그를 만들고 싶은 생각이었기도 하고, 지금 하고 있는 프로젝트가 인원들이 서로 다른 분야의 기술을 가지고 있어, 기술 교
[next.js] styled components 스타일이 적용전에 렌더가 되는 문제 해결법
styled components 스타일이 적용전에 렌더가 되는 문제 해결법 Install next.js Add styled-components add babel plugin and .bablerc file 루트 파일에 .babelrc 파일 만들기 .babelrc Create the _document.js file pages 폴더 아래에 _doc...
[Next.js] _app.js에 대해서
Next.js에서 app.js는 초기에 기본 페이지들의 component로 사용된다. 당신은 app.js를 페이지들에서 사용하거나 무시할 수 있다. _app.js의 기능들은 아래와 같다. 페이지들이 변화할 때 layout을 유지 페이지를 navigating 할 때 state(상태) 유지 componentDidCatch로 고객들의 에러 관리 페이지들에 추가...
[Project 개발 일지] next.js로 header생성 과정2
기본요소 채우기 Screenshot 2019-10-18 14.05.30.png 가장 기본적으로 '로고', '검색바', '검색버튼', '사인업', '로그인' 이라는 요소들이 필요한 상황입니다. 단순하게 기능만 채워 넣어 보겠습니다. styled-components 파트 Header function 파트 코드 작성시 이런 기본적인 형태의 헤더가 완성...
[Project 개발 일지] next.js로 header생성 과정1
주의 next.js의 workflow와 개념을 충분히 이해하지 못했기 때문에 다소 부정확한 정보가 포함되어 있음을 이해해주시길 바랍니다. Project 지도 저의 프로젝트는 카페 검색 사이트를 만드는 것입니다. Screenshot 2019-10-18 14.05.30.png 위쪽 빨간 박스를 Header로 부르겠고 이번에 제가 설명할 부분입니다. ...
Next의 탄생 배경
Next.js React, Vue로 프로젝트를 진행한다는 것은 SPA(Single Page Application)을 만들어야 한다는 것인데, SPA의 큰 단점은 클라이언트 서버 렌더링(CRS) 즉 첫 요청시 한페이지만 불러온 후 기존 페이지를 수정해서 보여주는 형태이기 때문에 아래와 같은 문제점이 생깁니다. 1. 검색엔진의 어려움, SEO의 최적화 문제...
Javascript iterator와 iterable, generator 어떻게 구현하고 사용할까?
iterable? [Symbol.iterator] iterator? generator? 어떻게 구현하고 어떻게 사용하지?