소프트웨어 테스트란? 테스트란 무언가 동작하는지를 확인하는 행위입니다. 소프트웨어 테스트란 소프트웨어가 의도한대로 동작하는지를 테스트하는 행위를 의미합니다. 옛날에는 개발자는 개발만하고, 소프트웨어가 올바르게 동작하는지를 확인하는 테스트팀이 별도로 존재하며, 개발자

클로저란? 클로저란 무엇일까? 클로저는 자바스크립트만의 개념은 아니고 함수를 일급객체로 사용하는 모든 언어에서 사용되는 특성이다. 클로저의 정의는 언어마다, 그리고 그것을 설명하는 사람마다 조금씩 다르게 말하는 경향이 있다. MDN에서는 클로저의 정의를 아래와 같이

의존성 역전 원칙(DIP) 의존성이란 특정한 모듈이 동작하기 위해서 다른 모듈을 필요로 하는 것을 의미합니다. 의존성 역전 원칙은 “유연성이 극대화된 시스템"을 만들기 위한 원칙입니다. 이 말은 곧 소스 코드 의존성이 추상에 의존하며 구체에는 의존하지 않는 것을 의미

관심사의 분리란? 개발에는 관심사의 분리(Seperation of Concerns)이라는 용어가 있다. 이는 좋은 코드를 짜기 위한 가장 기본적인 원칙이며, 더 좋은 애플리케이션을 만들기 위한 여러 디자인 패턴, 기법, 아키텍쳐 등은 결국 모두 이 관심사의 분리를

Context API Context API란 React에서 제공하는 내장 API로서 컴포넌트들에게 동일한 Context(맥락)을 전달하는데 사용할 수 있다. 일반적으로 리액트에서 데이터를 전달하는 기본 원칙은 단방향성이며, 부모 컴포넌트에서 자식 컴포넌트 방향으로만

렌더링(rendering)이란? 렌더링이란 화면에 특정한 요소를 그려내는 것을 의미하며, 브라우저에서 렌더링이란 DOM요소를 계산하고 그려내는 것을 의미한다. HTML과 CSS를 통해서 만들어지고 계산된 DOM과 CSSOM은 결합되어, 위치를 계산하고, 최종적으로 브라

CI/CD란? CI/CD는 Continuous Integration(CI)와 Continuous Delivery/Deployment(CD)를 통합해서 부르는 용어이다. CI/CD는 개발 과정에서 필요한 빌드, 테스트, 배포등의 과정을 자동화한다. CI/CD를 통해서

서버의 운영 방법 대표적으로 서버를 운영하는 방법에 있어서 두 가지 방법이 있다. 온 프레미스(On-Premise) 방법과 클라우드 컴퓨팅(Cloud Computing)이 있는데, 그 중에서 최근에 많은 각광을 받고 있는 클라우드 컴퓨팅이란 무엇이고, 어떤 방식으로

팀 협업이란? 우선 개발자로서 필요한 역량이란 크게 두가지가 있다. 하드 스킬과 소프트 스킬이다. 하드 스킬은 개발 업무에 있어 필요한 지식과 기술을 말하고, 소프트 스킬은 커뮤니케이션 능력, 협업 능력같은 팀으로서 일할 수 있는 능력을 말한다. 여기서 소프트 스킬

프로젝트를 진행함에 따라 Figma를 사용해 프레임워크 디자인을 만들다 보니 공통적으로 사용하게 되는 버튼, input, 모달들이 있어 매번 새로운 모달을 각자가 만들기 보다는 재사용성이 가능한 컴포넌트를 만들고 사용하는 것이 더 빠르고 효율적이라 생각하여 제작하게 되었다. 초기 공통 컴포넌트 Button props 중에서, 세가지 타입에 따라 (Sm,...

REST-API & Axios를 통해서 서버에 데이터를 요청하는 방식을 사용하면서 일어났던 에러나 개선점에 대해 회고를 작성하였다. axios.create 위의 코드는 프로젝트에 적용시킨, axios를 사용해서 API요청을 할 때 default 설정을 적용시킨 것

이전에 AWS EC2를 활용하여 서버를 배포해 본 경험이 있었지만, 이번 프로젝트를 진행하면서 예상을 뛰어넘는 에러가 발생하여 고전했던 경험이 있었다. 이번 프로젝트를 경험으로 여러 문제를 겪고, 이를 해결한 과정에 대해서 기술하고자 한다. EC2 서버 성능 문제 docker build 과정에서 만난 Killed 이번 프로젝트에서 EC2 인스턴스를 프리...

Image 컴포넌트 프로젝트에서 크게 사용한 부분은 메인페이지에 이미지들이 많이 사용되었는데, Image 컴포넌트의 디자인 에러나 반응형 크기 조절이 잘 안됐기 때문에 처음 목업 작업시에는 img 태그를 사용해서 적용시켰지만, next.js의 프레임워크를 사용하면서

채팅창 구현하기 프로젝트에서 chat-GPT 기능을 활용하여 채팅형식의 심리상담을 받을 수 있는 기능을 구현하였다. 여기서 적용한 내용과 개선해야 될 점에 대해서 정리하였다. UI UX를 고려한 채팅 페이지 UI는 카카오톡과 같은 채팅페이지를 비슷하게 벤치마킹하여 구성하였다. 여기서 자신의 고민을 작성 후, UX를 고려하여 Enter 또는 전송 버튼을...

팀 프로젝트 로맨스가 필요해 사이트를 제작하면서 개선점이나 반성할 점에 대해 기록하기 위해 적었습니다. try-catch 의 고찰 기본적으로 스크립트가 실행될 때, 에러가 발생한다면 그 즉시 스크립트를 중단하고 콘솔에 에러를 출력시킨다. 여기서 try-catch는 스

무료로 사용할 수 있는 구글 폰트를 사용하여 개인 프로젝트의 폰트를 변경해보았다.사용된 폰트는 2종류 이며 title, content 부분에 각각 따로 적용하였다.사이트에 접속하여 Download family를 눌러 폰트를 다운로드 해주자.React 폴더구조에서 pub

객체간 타입 형변환 자바에서 예외적으로 Strongly typed language 가 적용되지 않는 경우가 있다. 상속관계에서 자식 클래스가 부모 클래스 타입으로 참조되는것이 허용되며 이를 up-casting 이라고 한다. 한번 부모 클래스 타입의 클래스로 참조가 이루어진 이후 다시 자식 클래스로 참조하는 것을 down-casting 이라고 한다. ...

상속관계의 초기화 과정 - 생성자 호출 상속관계에서 자식 클래스를 인스턴스화 하면 부모 클래스의 객체도 인스턴스화가 진행된다. 자식 클래스의 객체가 인스턴스화 되기 위해서는 부모 클래스의 객체가 인스턴스화 되어야한다. 즉, 가장 상위의 부모 클래스부터 인스턴스화가 진행된다. 즉 Heap에 메모리가 할당될 때 부모의 필드부터 필요한 메모리공간을 계산을 ...

상속(inheritance)의 이해 상속은 연관있는 클래스들에 대해 공통적인 구성요소를 정의하고, 이를 대표하는 클래스를 정의하는 것. 상속 관계는 "is a" 관계를 의미하며 extends 키워드를 통해 상속관계를 정의. 상속관계에서 상속을 받는 클래스를 sub class, derived class, extended class, child clas...

JAVA의 메모리 관리 stack area: 지역변수, 매개변수가 할당되는 영역으로 '초기화'가 진행되지 않는다. heap area: 객체와 모든 인스턴스 객체가 할당되는 영역으로 '자동으로 초기화'가 진행된다. static area or method area: 메소드의 바이트코드, static 변수가 할당된다. 여기서 static area는dat...