ki hyun's 개발블로그

🪙 2.0 암호화폐 먼저 2세대 암호화폐와 1세대 암호화폐의 가장 큰 차이는 사람들과의 교류가 가능한 것이다. ??? 비트코인을 거래하는 것도 교류 아닌가? 2세대 암호화폐에서 말하는 교류는 단순히 비트코인을 주고받는 거래와는 차원이 다른 교류를 말한다. 여기에서의 교류는 모두 스마트 컨트랙을 통해 이루어지며 100% 탈중앙화로 진행된다. 🔗 스마트 컨트랙 스마트 컨트랙은 말 그대로 똑똑한 계약이다. 위에서 말했듯이 100% 탈중앙화로 돌아가며 100% 코드로만 움직인다. 또한 스마트 컨트랙을 사용한다면 탈중앙화된 앱을 만들 수 있으며 코드를 공유 네트워크에 올린다면 그 누구도 통제할 수 없는 탈중앙화 앱을 만들 수 있다. 그렇다면 이러한 스마트 컨트랙으로 무엇을 할 수 있을까? 🏠 숙박 공유 서비스 스..

🧐 블록체인? 블록체인이란 데이터를 가지고 있는 블록들이 서로 연결되어있는 체인을 말한다. 블록체인은 데이터베이스의 일종으로 볼 수도 있는데 데이터를 가지고 있는 블록들이 서로 연결되어있기 때문이다. 블록체인이 데이터베이스라면 다른 멋진 데이터베이스도 많은데 왜 굳이 블록체인이지? 라고 생각할 수 있다. 하지만 블록체인의 멋진점은 데이터베이스가 아닌 다른곳에 있다. 1. ➕ Append only (추가만 가능) 이걸 본 개발자들은 충격을 받을 수도 있다. 데이터베이스라면 당연히 추가도 되고 수정도 되고 편집도 되어야 하는데 블록체인은 추가만 할 수 있다니 말이다. 하지만 추가만 가능하다는 건 좋은 일일 수도 있다. 왜냐하면 대학 학위, 비트코인 거래내역 등과 같은 정보들은 절대로 누군가 임의로 수정해서는..

🧐 React Hook Form? React Hook Form은 React에서 Form을 쉽게 만들기 위한 라이브러리로 공식문서에 적혀있는 그대로 성능이 좋고 유연하며 유효성 검사에 아주 탁월합니다. 장점 적은 코드로 더 좋은 퍼포먼스를 낼 수 있다. 다른 라이브러리 혹은 React에 비해 Re-render 수가 적다. Fast Mounting (로딩속도가 빠름) TS를 기본으로 지원함단점 잘 모르겠음... How to use? 먼저 React Hook Form을 사용하기 위해 yarn 혹은 npm을 사용하여 설치합니다. npm install react-hook-form yarn add react-hook-form 설치가 되었으면 React Hook Form을 사용하기 위해 Form을 만들어 보겠습니다...

🧐 Tailwind CSS? Tailwind CSS는 이름에서 부터 알 수 있듯이 CSS Framework 입니다. 하지만 Bootstrap과 같은 다른 CSS 프레임 워크들과는 다르게 Tailwind CSS는 디자인의 커스터마이징이 아주 편합니다. 공식문서에 있는 예제를 하나 들고 와서 설명해보겠습니다. 원래는 디자인을 하기위해 다음과 같이 긴 CSS를 사용했지만 Tailwind CSS를 사용한다면 저렇게 길었던 CSS를 다음과 같이 줄일 수 있습니다. 코드가 놀랍도록 줄어들었지만 class 이름이 좀 많이 더러워 보입니다. 하지만 Tailwind CSS는 이러한 문제도 이미 해결해 두었습니다. @apply라는걸 사용하면 되는데 @apply에 대해서는 뒤에 자세히 설명하도록 하겠습니다. 설치 Tailw..

velog를 돌아다니다가 재미있는 글 하나를 보게 되었다. [Github] github profile 예쁘게 꾸미기라는 글인데 예전에 어떤 고수님의 깃허브 프로필을 보고 놀랐던 기억이 있어서 나도 저렇게 해보고 싶다 생각했는데 이 글을 통해서 드디어 해보게 되었다. 1. Repository 생성 자신의 github 계정 이름과 똑같은 repository를 만들면 된다. 난 이미 레포를 만들어 놔서 경고가 뜨지만 밑에 고양이가 해당 repository를 내 깃헙 프로필로 쓸 수 있다고 알려준다. ✅ Add a README file를 체크해야한다! 2. README.md 수정 이제 만들어진 README를 입맛에 맞게 수정하면 된다. 여러 사람들이 깃헙 프로필을 둘러보니 대부분 기술스택, 컨택등을 넣는것 같아..

💡 Spring을 배우고 싶어서 IntelliJ을 사용해 보니 너무 못생기고 무서워서 VScode로 Java를 사용해 보려 한다. 1. install Extension 저거 하나만 설치하면 아래 6가지 익스텐션이 모두 설치된다. 2. JDK 설치하기 컴퓨터에 JDK가 설치되어있지 않다면 설치 홈페이지에 들어가서 운영체제에 맞는 JDK를 설치하면 된다. 3. 테스트 해보기 왼쪽에 Run and Debug를 누르면 프로그램이 실행된다. 확실히 IntelliJ보다 이쁘고 빠르게 실행되는거 같아 좋은거 같다.

Java 1995년에 썬 마이크로시스템즈에서 발표한 객체지향 언어 현재 썬 마이크로시스템즈는 오라클에 인수가 된 상태자바의 특징 플랫폼에 독립적이다. 자바는 JVM() 만 있으면 윈도우, 리눅스, 맥등 어떤 플랫폼에서도 실행이 가능 객체지향 언어이다. 메모리 관리를 자동으로 해준다. 변수 & 상수 변수 형식 int number; 변수이름을 쓸때 지켜야할 점 하나 이상의 글자로 이루어져야 함 첫 번째 글자는 문자 이거나 '$', '_'이어야 함 두번재 이후의 글자는 숫자, 문자, '$', '_'이어야 함 '$', '_' 이외의 특수문자 사용 불가능 길이 제한이 없음 키워드는 식별자로 사용할 수 없음 상수 값을 표현하는 단..

1.0 Go? Go는 2009년 구글에서 일하는 로버트 그리즈머, 롭 파이크, 켄 톰프슨이 개발한 프로그래밍 언어이다. 일단 Go는 속도가 매우 빠르다. 이처럼 Go는 Python처럼 간결한 문법 구조를 가지면서도 Python보다 훨씬 빠른 속도를 가져 많은 사람들에게 사랑받는 언어로 떠오르고 있다. 2.0 Go 시작하기 먼저 Go를 시작하기 위해서는 컴퓨터에 Go를 다운받아야 한다. 설치가 귀찮거나 개인 컴퓨터가 없다면 repl.it을 사용하는 것도 좋은 방법이다. 2.1 Go 설치 여기에 들어가서 운영체제에 맞는 Go를 다운로드 받으면 된다. Go를 설치하면 C드라이브 혹은 /usr/local 에 go라는 폴더가 생기는데 Go프로젝트는 모두 go폴더에 있어야 한다. 만약 go폴더가 없다면 C드라이브 ..

1. NestJS? 먼저 Nest.JS가 해결하는 문제가 뭔지 알아보자 Nest.js는 Node.js의 아주 중요한 문제를 해결한다. Node.js로 백엔드를 개발할때는 0부터 시작해야한다. 1개의 파일에서 시작해서 점차 크기를 키워 나가야 하는것이다. 하지만 Django같은 다른 프레임워크들에는 수많은 규칙들이 있다. 그래서 그런 규칙들을 따라 백엔드를 만들기만 하면 휼륭한 백엔드를 만들 수 있다. 하지만 Node.js에는 그런게 없다. 객체지향을 할지 함수지향을 할지 폴더명을 무엇으로 할지 그 어떤 규칙도 없다. 이런점은 장점이 될 수도 있지만 큰 프로젝트를 한다면 위의 장점은 단점이 되어버린다. 이러한 단점을 보완하기위해 Nest.JS가 나온 것이다. Nest.js를 사용한다면 Node.js를 Dj..

✍배우게 된 계기 약 1년 반 전부터 열심히 웹에 대해 배우기 시작했고 최근에는 React를 열심히 배우고 있었다. 그러다가 다른 프레임워크에도 관심이 생겨 찾아보게 된 것이 바로 Next.js였다. Next.js? 넥스트는 버샐(vercel)에서 만든 리액트 기반의 프레임워크로 개발자에게 뛰어난 생산성과 편의성을 제공한다. 리액트 기반이기 때문에 리액트에 관한 지식이 필요하다. 넥스트를 사용하는 이유? (리액트의 단점) 페이지를 불러올때 모든 자바스크립트 파일을 한번에 불러옴 (⏰시간이 오래걸림) 검색 엔진 최적화(SEO)에 좋지 못함 ✅ 해결법: 서버 사이드 렌더링(SSR)을 사용하면 해결됨. 서버 사이드 렌더링(SSR)? 장점 사이트에 접속시 렌덩링된 html을 불러온다. → 반응X but, 속도가..