현인

들어가며 Next.js는 프레임워크이고 React는 라이브러리이다. 노마드코더 강의에서 프레임워크와 라이브러리의 차이에 대해 간략히 설명해주었는데, 제대로 된 차이점을 이해하고 싶어서 더 알아보려한다. 프레임워크란? 프레임워크는 말 그대로 뼈대나 기반구조를 뜻하고, 제어의 역전 개념이 적용된 대표적인 기술이다. 소프트웨어에서의 프레임워크는 '소프트웨어의 특정 문제를 해결하기 위해서 상호 협력하는 클래스와 인터페이스의 집합' 이라 할 수 있다. 따라서 완성된 어플리케이션이 아닌 추상화된 어플리케이션이라고 볼 수 있다. 개발자는 이 추상화된 부분들을 완성하면 된다. 프레임워크의 특징 특정 개념들의 추상화를 제공하는 여러 클래스나 컴포넌트로 구성되어 있다 추상적인 개념들이 문제를 해결하기 위해 같이 작업하는 ..

들어가며 Next.js 학습을 하며 정리할 예정입니다. 노마드 코더 'Next.js 시작하기' 강의를 참고하며 학습 내용을 정리할 예정입니다. Next.js 13 이상 VSCode Next.js 프로젝트 생성 npx create-next-app@latest #타입스크립트를 사용할 경우 npx create-next-app@latest --typescript CNA를 활용하여 프로젝트를 생성합니다 typescript를 사용하는 경우 --typescript 옵션을 추가합니다 추가 설정 위 명령어를 실행하게 되면, 몇 가지 설정을 추가적으로 하게 됩니다. 내용은 다음과 같습니다. 1. What is your project named? 프로젝트 명을 입력한다 2. Would you like to use ESLin..

length 프로퍼티 활용 var str = "hello" console(str.length) //5 출력 String.prototype.charCodeAt() - 주어진 index에 위치한 문자의 UTF-16 코드 값을 리턴한다. const sentence = 'The quick brown fox jumps over the lazy dog.'; const index = 4; console.log(`The character code ${sentence.charCodeAt(index)} is equal to ${sentence.charAt(index)}`); // 출력: "The character code 113 is equal to q" String.fromCharCode() - 주어진 UTF-16 코드..

프로젝트를 하던 중 TypeScript의 type과 interface의 차이점이 궁금하여 알아보았다 interface는 type과 마찬가지로 객체의 타입의 이름을 지정하는 또 다른 방법이다. 확장하는 방법의 차이 interface Person { name : string, age : number } interface Student extends Person{ school : string } extends 방식 type Person = { name : string, age : number } type Student = Person & { school : string } & 활용 선언적 확장 type은 새로운 속성을 추가하기 위해서 다시 같은 이름으로 선언할 수 없지만, interface는 항상 선언적 확장..

안드로이드 스튜디오에서 MetaMask를 실행하기 위해서는 WalletConnect 라이브러리를 사용해야 한다. WallectConnect라이브러리 공식문서를 참고하여 개발하였다. https://docs.walletconnect.com/2.0/ About | WalletConnect Docs What is WalletConnect? docs.walletconnect.com 안드로이드 스튜디오 버전 : 2022.1.1.21 공식문서 내용 코틀린 스크립트 기반 gradle 파일을 예제로 설명하고 있어서 코틀린 스크립트로 gradle을 설정하지 않았을 경우 root/build.gradle.kts 에 설정하는 부분을 setting.gradle 파일에 넣어주면 된다. setting.gradle ... depend..

기존의 웹 방식, MPA (Multi Page Application)와 발전 과정 MPA는 link tag를 사용하는 전통적인 웹 방식이다. 과거에는 웹에서 제공되는 정보가 그렇게 많지 않았고, 많다고 해도 페이지가 나누어져 있었기 때문에 데이터를 쪼개서 보여줄 수 있었다. 하지만 요즘은 성능이 좋아지고 기술도 발전하는 등 다양한 이유로 하나의 페이지에서 보여줄 수 있는 정보가 점점 많아졌다. 게다가 서비스 사용자 또한 증가하여 서버 측에서는 사용자 각각에 대한 페이지를 만들어야 하니 과부하가 걸렸다. 왜 과부하가 걸렸을까? MPA는 새로운 페이지를 요청할 때마다 정적 리소스가 다운로드 되고 전체 페이지를 다시 렌더링하는 방식을 사용한다. 따라서 변경이 필요없는 부분을 포함하여 전체 페이지를 갱신하게 된..