본문 바로가기

분류 전체보기

(93)

[ NEXT.JS ] Next.js에 대해 알아보기. NEXT.JS는 무엇일까? Next.js 는 빠른 웹 애플리케이션을 만들기 위한 빌딩 블록을 제공하는 React 프레임 워크로, React에 필요한 도구 및 구성을 처리하고 애플리케이션에 대한 추가 구조, 기능 및 최적화를 제공한다. Next.js는 SSR(Server-Side-Rendering), 정적 웹 페이지 생성 등 React 기반 웹 애플리케이션 기능들을 가능하게 하는 Node.js 위에서 빌드된 오픈 소스 웹 프레임워크이다. React를 사용하여 UI를 구축한 다음, Next.js 기능을 점진적으로 채택하여 라우팅, 데이터 가져오기, 통합과 같은 일반적인 애플리케이션 요구 사항을 해결하는 동시에 개발자 및 최종 사용자 경험을 개선할 수 있다. React의 공식 페이지에서는 아래와 같이 소개한다..

[ WEB ] Web Storage에 대해 알아보기. Web Storage API는 브라우저에서 키/값 쌍으로 구성되며, 객체와 비슷하다. 이 데이터들은 페이지 로딩에도 온전하게 유지가 되고 key와 value는 항상 문자열이다.(정수를 사용할 경우 자동으로 string으로 변경됨. 자스의 객체 동작 방식과 유사.) 쿠키보다 훨씬 직관적으로 저장할 수 있는 방법을 제공한다. Web Storage 개념과 사용법 Web Storage는 sessionStorage와 LocalStorage의 두 가지 방식이 있으며, Window.sessionStorage와 Window.localStorage 속성을 통해 사용할 수 있다. 두 가지 속성중 하나에 접근하면 Storage 객체의 인스턴스를 생성하게 되고, 그것을 사용하여 데이터 항목을 추가, 회수, 제거 할 수 있다...

[ ReactNative ] react-native-vector-icons 셋팅하기. react native 프로젝트를 진행할 때 내가 자주 사용하는 아이콘 라이브러리가 있다. 바로 react-native-vector-icons 이다. 다양한 폰트의 아이콘을 사용할 수 있어서 자주 애용하는데, 예전에는 해당 라이브러리를 link 해주면 금방 사용했지만 최근 프로젝트에서는 ios로 시뮬레이터를 돌리고 있었는데, 아이콘을 사용한 부분에서 해당 에러가 발생했다. unrecognized font family 'Feather' 내가 사용하려던 아이콘의 font 를 인식할 수 없다는 오류였다. 흠.. 그래서 구글링을 통해 방법을 찾았다. 참고 사이트 : https://aboutreact.com/react-native-vector-icons/ 전체 아이콘 확인 : https://oblador.gith..

[ Git ] git revert 이후에 master브랜치에 merge 하기. 이직하고 첫 주에 식은땀 나는 일이 발생했다. 간단하게 PR 확인만 해주면 되는거였는데.. 별 생각없이 습관처럼 내가 PR merge를 해버렸다. 그래서 내가 PR merge를 했던 커밋에 대해 revert를 진행했는데, revert이후에 다시 master 브랜치에 merge를 진행하려고 하니, 변경 사항이 없다고 나오면서 merge가 불가능했다.......!!🙀 이슈는 아래와 같은 상황. - 기존 master branch가 있고, feature branch가 존재. - feature branch를 master branch에 merge를 함. - merge된 master branch를 git revert 진행함. - 이후 다시 feature branch를 master branch에 merge 하려고 시도..

[ HTTP ] HTTP에 대해 알아보기 HTTP : HyperText Transfer Protocol HTTP는 HTML 문서와 같은 리소스들을 가져올 수 있도록 해주는 프로토콜이다. HTTP는 웹에서 이루어지는 모든 데이터 교환의 기초이며, 클라이언트-서버 프로토콜이기도 하다. 하나의 완전한 문서는 텍스트, 레이아웃 설명, 이미지, 비디오, 스크립트 등 불러온(fetched) 하위 문서들로 재구성된다. 보통 브라우저인 클라이언트에 의해 전송되는 메시지를 요청(requests)이라고 부르며, 그에 대해 서버에서 응답으로 전송되는 메시지를 응답(responses)이라고 부른다. HTTP/1.0은 1996년 HTTP/1.1은 1999년 HTTP/2는 2015년 발표되었다. HTTP 요청 메소드 - GET: 클라이언트가 서버에게 URL에 해당하는 ..

[ Flutter / macOS ] Flutter macOS 설치 및 셋팅하기. 윈도우나 리눅스, 크롬 등은 Flutter 공식 페이지의 Install에서 찾아서 참고하면 된다! https://docs.flutter.dev/get-started/install 1. macOS intel 프로세서 zip 파일 다운로드. 나는 맥유저라서 Flutter 공식 페이지의 macOS install을 참고했다~! macOS install 참고 ** 현재 설치하려는 macOS 에서 인텔 프로세서를 사용하는지, Apple Silicon 을 사용하는지 확인하고 해당되는 프로세서의 zip 파일을 다운받는다. Apple Silicon이 탑재된 Mac 컴퓨터 확인 2. 다운받은 zip 파일을 아래의 명령어를 통해 압축 해제. cd ~/development unzip ~/Downloads/flutter_mac..

[ JavaScript ] undefined와 null의 차이에 대해 알아보기. 자바스크립트에서 '빈'값을 의미하는 비슷한 원시 값이 존재하는데 바로 null과 undefined 이다. 1. undefined ES6기준 7개의 데이터 타입중 하나인 undefined는 var 키워드를 통해 선언을 하면 선언과 동시에 자바스크립트 엔진에 의해 undefined로 초기화 되기 때문에, 할당문 이전에 변수를 참조하려고 하면 undefined가 반환된다. ( let 키워드와 const 키워드는 undefined로 초기화되지 않음. ) var user; console.log(user); // undefined undefined의 값은 undefined가 유일하며 개발자가 의도적으로 준 빈 값이 아니라, 자바스크립트 엔진에 의해 undefined로 초기화된 값이다. console로 찍었을 때 u..

[ React / Recoil ] React의 상태관리 라이브러리 Recoil의 effects 사용하기. 나는 보통 react 프로젝트를 하게 되면 간단한 상태 관리들은 대부분 recoil을 통해 하는데 이번에 recoil의 부가적인 기능들에 대해 더 서치를 하다가 Atom Effects에 대해 알아보게 되었다. Recoil 공식 페이지의 Atom Effects 설명은 아래 링크를 통해 참고하면 된다. atom effects - recoil recoil 공식 페이지에서 소개하는 atom effects는 부수효과들을 관리하고 Recoil의 atom을 초기화하거나 동기화하기 위해 사용하는 API라고 설명한다. Atom Effects - 상태 지속성 - 상태 동기화 - 히스토리 관리 - 로깅 등에 유용하고 React Effects와도 유사하지만 Atom Effects는 atom을 정의할 때 atom 정의의 일부로..

이전 1 ··· 4 5 6 7 8 9 10 ··· 12 다음

티스토리툴바