티스토리

Dev, Ang

검색하기

블로그 홈

Dev, Ang

dev-ang.tistory.com/m

깔끔하게 털어마시는 개발스트로베리 🍹

구독자: 1

방명록 방문하기

주요 글 목록

Next.js Conf 10월 26일 컨퍼런스에서 발표된 Next.js 13 버전, 새롭게 변경된 내용을 정리해봅니다 :) | 공식 문서 | 컨퍼런스 페이지 | 예제 배포 사용 Next.js 13 App Playground – Vercel Explore the new app directory (App Router) in Next.js 13. vercel.com 최신 Next.js 설치 npm i next@latest react@latest react-dom@latest eslint-config-next@latest 무엇이 달라졌는지? app/ Directory (beta) (app/디렉토리): Easier, faster, less client JS Layouts (레이아웃) React Server Components (리액트 .. 공감수 0 댓글수 0 2022. 10. 30.
한글 도메인 주소가 DNS에 등록 & 처리되는 과정 Result 전세계의 다국어 도메인은 퓨니코드로 변경되어 등록과 처리가 진행된다. 인터넷 사용자가 입력한 다국어 도메인은 클라이언트 측에서 아스키 기반의 퓨니코드로 변환되 네임서버로 전송된다. | 과정 주소창에 다국어 도메인이 입력된다 (ex. 청와대.com) 클라이언트(브라우저)측에서 퓨니 코드로 변환한다 ( ex. xn--vk1b187a8ue.com ) DNS의 네임 서버로 전송되 IP 주소를 찾아 접속하게 된다 * 네임 서버는 퓨니코드 형태의 영역 데이터를 운영한다 . 1) 국제화 도메인 네임 ( IDN _ Internationalized Domain Name ) 인터넷 상에서 호스트의 주소를 나타내는 도메인 네임은 기본적으로 라틴 문자, 숫자, ( _ )언더바 등으로 구성되어있다. 여기서 말하는 .. 공감수 0 댓글수 0 2022. 1. 6.
Next js 맛보기 공식 페이지 Getting Started | Next.js Get started with Next.js in the official documentation, and learn more about all our features! nextjs.org 리액트로 프로젝트를 진행하면서 새롭게 프로젝트를 만들게 된다면 next js를 사용해 개발해보고 싶었습니다. Next.js는 Zeit에서 만든 React 프레임워크로 리액트만으로 개발를 진행하면 핵심기능 외의 라이브러리(라우터, 상태 관리 등)를 추가로 설치해 조합해야 했지만, Next에선 별도의 설치없이 프론트앤드 개발에 필요한 다양한 기능을 여러 3rd 라이브러리로 기본으로 제공합니다. Next 프로젝트 생성 기본 설치를 위해선 npx 혹은 yarn을 통해.. 공감수 0 댓글수 0 2021. 11. 10.
M1 맥북 - VS code 및 도커 설치 1. VS code 1 ) 설치 URL 비주얼스튜디오코드는 마이크로소프트사에서 만든 텍스트 에디터로 ts기반으로 개발된 오픈소스 프로젝트입니다. 웹개발 및 다양한 언어 개발에 유용하게 활용됩니다. Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. code.visualstudio.com 2 ).. 공감수 0 댓글수 0 2021. 11. 8.
M1 맥북 - Nodejs, npm & yarn 설치 최근 M1 맥북을 구매하게 되면서 프론트 개발에 필요한 프로그램 설치를 진행하였습니다. 리마인드겸 정리해두는게 좋을 것 같아 설치한 목록을 정리해보려고 합니다. 추가 사항이 생기면 아래에 계속 업데이트 해두겠습니다. 1. Node.js & npm 1) 설치 URL https://nodejs.org/en/download/ Download | Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 2) 설치 단계 사이트에 접속해 macOS Inataller 아이콘을 클릭하면 패키지 다운로드가 진행됩니다. 다운로드 폴더 내부에 node-v16.13.0.pkg와 같이 노드 버전이 명시된 패키지 파일을 확.. 공감수 0 댓글수 0 2021. 11. 6.
Redux, 제대로 알고 있을까 다양한 곳에 동일한 정보가 분산되어 있을 때 한 곳의 정보를 업데이트하게 될 경우 props를 통해 전달해주는 방법은 데이터의 위치가 가깝다면 편리하지만 프로젝트 크기가 커진다면 번거로운 작업이 될 수 밖에 없다. 그렇다면 업데이트 사항을 props로 전달해주는 방법 말고 다른 방식은 뭐가 있을까? redux? context? mobx은 또 무엇일까 Redux - A predictable state container for JavaScript apps. | Redux A predictable state container for JavaScript apps. redux.js.org 리덕스 공식문서에 접속하면 더 다양한 정보를 살펴볼 수 있으며 리덕스를 사용하기 위해선 사전 설치 작업이 필요하다. 1. 터미.. 공감수 0 댓글수 0 2021. 10. 6.
🛰 API 호출로 프로젝트에 필요한 데이터 GET해오는 방법 (Feat. 프론트앤드, React) 여름이었다 .. 프로젝트 제작을 위해 필요한 데이터가 있다면 API 호출을 통해 받아올 수 있는데 리액트의 경우 JSX 파일 내부에 무작정 자바스크립트 코드(호출을 위한)가 너무 많으면 가독성에 좋지 않기 때문에 별도의 js 파일을 만들어 분리하는 것이 좋다. 프로젝트에서 api 호출이 빈번할 경우라면, service 폴더를 생성해 호출 관련 js 코드를 한곳에 관리해주면 깔끔한 분류가 가능하다. 😉 ex) 특정 사이트의 식단 데이터를 요청하는 경우 ( = API 호출을 통해 데이터를 받아와준다 ) 1 . 사이트를 방문해 API 호출을 원하는 데이터를 확인한다. 2 . 개발자 도구 ( F12 ) 속 - Network 창에 접속해 식단 데이터가 담긴 파일을 확인한다. Preview 창을 통해 자세한 데이터.. 공감수 0 댓글수 0 2021. 8. 30.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.