본문 바로가기

반응형

전체 글

(26)
[TypeScript] 타입스크립트의 기본 타입 정리 저는 지금 타입스크립트를 기본으로 한 환경에서 개발을 하고있습니다. 하지만 타입스크립트를 쓰면서 아무 생각없이 그냥 쓰던 타입들이 있어서 알아보던 중 기본 타입이 굉장히 많다는걸 알게되어 블로그에 정리 해보려고 합니다. 타입스크립트의 기본 타입 Boolean Boolean 타입은 true 또는 false 값을 가지는 논리 타입입니다. let isDone: boolean = false; Number Number 타입은 부동소수점 숫자를 나타냅니다. 타입스크립트는 10진수와 16진수 리터럴 외에도, ECMAScript 2015에서 도입된 2진수 및 8진수 리터럴을 지원합니다. let decimal: number = 6; let hex: number = 0xf00d; let binary: number = 0b..
[Next] 정적 라우팅과 동적 라우팅 지금 개인적으로나 업무적으로 사용하고 있는 Next.js 에서는 자체적인 라우터를 내장하고 있다. 이번엔 라우터를 통한 라우팅에 대해 적어보고자 한다. 라우팅이란? 위의 사진에서 나와있듯 라우팅은 쉽게 말해 페이지를 이동하는것이다. Next.js 환경에서는 위의 사진처럼 useRouter을 통해 내장된 라우터를 사용하게 되는데 보편적으로 많이 쓰이는 방식으로 router.push("path")가 있다. 또한 라우팅은 정적라우팅과 동적라우팅으로 나누어 지게 된다. 정적라우팅 정적라우팅은 쉽게 말하자면 라우팅을 할 때 경로를 하나하나 수동으로 추가해야되는 프로세스이다. 당연히 장단점이 존재 할 수 밖에 없다. 장점 - 정적라우팅은 다른 네트워크를 거치지 않아 동적라우팅에 비해 보안성이 좋다 - CPU의 부하..
[DEV] 절차지향과 객체지향 프로그래밍 1. 절차지향 컴퓨터의 작업 처리방식과 유사한 방식으로 물이 위에서 아래로 흐르는 것처럼 순차적인 처리가 중요시 되면서 프로그램 전체가 유기적인 연결이 될수있도록 하는 프로그래밍 기법이다. 장점 컴퓨터의 작업처리 방식과 비슷하다 실행속도가 빠르다 단점 유지보수가 어렵다. 같은 로직을 이용하더라도 순서가 달라졌을때 같은값을 리턴하지 않을 수 있다. 디버깅이 어렵다 시간이 지나면서 컴퓨터의 하드웨어적 성능이 좋아지고 그럼에 따라 새롭게 제시된 방법이 있는데 이것은 객체지향 프로그래밍이다. 2. 객체지향 캡슐화, 상속, 다형성을 가지고 실제 세계를 모델링 하는 방법이라고 하는데, 쉽게 말해서 객체라는 유닛을 가지고 조립해서 하나의 프로그램을 만드는것이다. 레고를 조립하는거라고 생각하면 쉬울것같다. 캡슐화 캡슐..
[디자인패턴] container-presenter 디자인 패턴(컨테이너, 프리젠터) 오늘은 container-presenter 패턴에 대해서 조금 써볼까 합니다. container-presenter 패턴은 처음 코딩을 시작하던 때 부트캠프에서도 사용하던 패턴이고 지금도 아토믹과 함께 업무, 개인 프로젝트에 적용하여 사용하고 있는 패턴입니다. 기존에 atomic구조를 공부하면서 간단하게 올렸던 글이 있는데 이 글도 같이 봐주시면 감사하겠습니다 🙇‍♂️🙇‍♂️🙇‍♂️ [디자인 패턴] atomic과 container,presenter 요즘 개인적으로 사이드 프로젝트를 진행하는데 있어서 디자인패턴에 대한 고민이 생겼다. 기존 내가 사용하던 패턴은 코드캠프에서 배웠던 container-presenter 패턴이었지만, 최근 추세와는 조금 takd.tistory.com container-presen..
[UI] MUI(material UI)는 무엇일까? 요즘 나는 회사에서 MUI를 이용하여 개발을 하고있다. 처음엔 스타일드 컴포넌트가 아닌 MUI를 이용해서 개발을 한다는것에 거부감이 들기도 했지만 mui라는 녀석도 상당히 간편하게 사용할수 있는 친구인것같아서 이렇게 블로그에 글을 적어보고자 한다. 내가 처음 mui를 접하게 된건 부트캠프 기간중 아이콘이나 인풋박스같은 컴포넌트를 개인 프로젝트에 적용하기 위해 사용하게 되었다 하지만 지금 다니는 회사에서는 jsx를 이용한 stylecomponent보다는 MUI를 이용한 디자인 컨벤션을 활용하여 전반적인 UI구조를 사용하고있다. mui는 무엇인가? materialUI 라고 불리던 MUI는 5버전으로 리뉴얼 되면서 기존의 materialUI라는 이름을 버리고 MUI라는 이름으로 바뀌었다. 4버전에서는 mate..
[TypeScript] 타입스크립트에서 type과 interface의 차이점 타입스크립트는 자바스크립트의 상위 집합 언어로 변수, 함수 등에 타입을 명시하여 실수를 줄이고 코드의 안정성을 높이는 장점을 가진다. 타입스크립트에서 타입을 정의할 수 있는 방법으로 'Interface'와 'Type'이 있으며, 둘 다 유사한 기능을 가지고 있는데, 두 기능은 차이점을 알아보겠습니다. Interface Interface는 타입스크립트 만의 고유한 개념으로, 객체의 타입을 정의하기 위한 수단이다. 인터페이스로 사용자 객체를 정의하면 다음과 같다. interface User { name: string; age: number; } 위 코드를 보면 User는 인터페이스 이름으로 사용자 객체를 정의하고 있는데, 앞으로 User 인터페이스를 사용하여 객체를 생성할 수 있다. const myUser:..
[회고] 프론트엔드 개발자 1년 회고 2022년 3월 2일 프론트엔드 개발자로서 첫 발을 내딛었다. 그로부터 1년이 지난 오늘 나는 어떤것이 바뀌었는지 또 어떤점이 아쉬운지 회고를 적어보고자 한다. 1년동안 나는 한번의 이직을 했고 내가 작업한 웹사이트가 어디선가 전시되기도 하고 또 다른 프로젝트는 외국의 어워즈에서 수상을 하기도 했다. 그 밖에도 1년간 참 많은 일이 있었던것같다. 처음 들어간 회사에서는 어느날 업무용으로 지금된 맥미니의 전원케이블을 가져갔다.... 덕분에 나는 내 개인 맥북을 이용해 업무를 했다. 또 아침에 작업하기로 했던 페이지가 작업중에 실시간으로 수정되는 경우도 있었고 새로운 기술(TS)을 도입하자는 의견엔 "그럼 니가 책임자 해 그럼 되겠다" 라는 이야기도 들었다. 신입으로서 보기에도 너무나 체계가 없는것같던 그 ..
[DEV] SOLID원칙이란? 회사 세미나 주제중 솔리드 원칙이라는게 나왔다. 개발을 하면서 한번 쯤은 들어봤을, 전공생이라면 더더욱 들어봤을 원칙인데 SOLID법칙 즉, 솔리드 법칙은 객체지향 프로그래밍에서 사용되는 다섯가지 원칙의 약어로 소프트웨어의 유지보수, 확장성, 재사용성, 테스트 용이성을 위해 개발된 원칙이라고 한다. 1. SRP ( Single Responsibility Principle ) 단일 책임 원칙이라고 불리는 원칙인데 하나의 클래스는 한 가지 책임만 가져야 한다는 원칙 2. OCP (Open-Closed Principle ) 개방-폐쇄 원칙이라고 불리는 원칙이며 소프트웨어의 구성 요소는 확장에는 열려있어나 하지만 변경에는 닫혀있어야 된다는 원칙 기존의 코드를 변경하지 않아도 새로운 기능을 추가할수 있어야 된다는..

반응형