개발 프로세스 개발 프로세스, 즉 소프트웨어 개발 프로세스 모델은 소프트웨어 개발 생명주기(SDLC, 이하 Software Develpment Life Cycle)을 기반으로 만들어졌다. 요구분석 및 시스템 명세 작성 문제분석단계라고도 하며, 개발할 소프트웨어의 기능과 제약조건, 목표 등을 사용자와 함께 정확히 정의하는 단계입니다. 개발하고자 하는 소프트웨어의 성격을 정확히 이해하여 이를 토대로 개발 방법과 필요한 자원 및 예산 예측 후 요구명세를 작성합니다. 설계 설계단계에서는 앞서 정의한 기능을 실제로 수행하기 위한 방법을 논리적으로 결정합니다. 크게 시스템, 프로그램, UI(User Interface) 설계로 나뉘며, 시스템 구조설계는 시스템을 구성하는 내부 프로그램이나 모듈 간의 관계와 구조를 설..

Cloud Computing & Deployment 아무리 열심히 개발하고 구현하여, 획기적이고 대단한 웹 서비스를 만들어도 배포를 하지않는다면 의미를 가지기가 힘들다. 따라서 웹개발자는 배포에 대한 지식을 탑재하고 있어야 하며, 간단한 배포정도는 혼자 할 수 있어야 한다. 배포방법에는 여러가지가 있는데, 대표적으로 클라우딩 컴퓨팅의 역사를 새로 쓴 Amazon Web Service(이하 AWS)가 있다. 아마존 웹 서비스(AWS) 아마존 웹 서비스(AWS)란 아마존이 자사의 노하우를 살려 제공하고 있는 '클라우드 컴퓨팅 서비스'이다. AWS는 컴퓨팅, 스토리지, 데이터베이스.분석,네트워킹,모바일,개발자도구,관리도구,IoT,보안,엔터프라이즈 에플리케이션 등 다양한 서비스를 제공한다. 이전에는 각각의 사업..

Hook이란? Hook은 함수형 컴포넌트에서 상태 값 및 다른 여러 기능을 사용하기 편리하게 해주는 메소드를 의미한다. Hook은 class형 컴포넌트가 아닌 함수형 컴포넌트에서만 사용할 수 있게 도와주는 것이기 떄문에 클래스형 컴포넌트에서는 작동하지 않는다. 함수형 컴포넌트와 클래스형 컴포넌트의 차이를 보기위해 버튼을 클릭하면 카운트가 1 증가하는 기능을 가진 컴포넌트를 두가지로 구현해보겠다. 클래스형 컴포넌트 //this 개념을 정확히 이해하지못하면 기능구현자체가 힘들 수 있고, 직관성 또한 떨어진다. class Counter extends Component { constructor(props) { super(props); this.state = { counter: 0 } this.handleIncr..

Virtual DOM을 하기이전에 DOM(Real DOM)이 뭔데? DOM은 웹페이지의 콘텐츠 및 구조, 그리고 스타일 요소를 트리구조로 표현함으로써, 프로그래밍 언어가(JS) 해당 문서에 접근하고 읽고 조작할 수 있도록 API를 제공하는 일종의 인터페이스다. 언제 내가 하나하나 HTML요소 만들어주고, 클래스만들어주고, 또 클래스 지워주고 이런 번거로운 짓을 하겠나. 자바스크립트를 통해 좀 더 웹페이지를 효율적으로 다룰 수 있다. (예를들면, 원래는 집을 따뜻하게 하기위해서는, 아궁이에 불을떼건, 연탄을 가서 피우건 해야 했다면 지금은 보일러 버튼 하나로 집의 온도를 조절가능한것과 비슷한 맥락이다.) Virtual DOM DOM은 알겠는데, Virtual DOM은 또 뭘까요? 가상 DOM? Virtua..

번들링 이런식으로 어떠한 제품을 묶음으로 판매하는 걸 '번들링' 이라고 한다. 웹 개발에서 번들링 그럼 웹 개발을 할 때 '번들링'을 한다고 하면 무슨 의미일까? (참고로 웹 개발에서 번들링 = 빌드 라고 할 수 있다.) 사용자에게 웹 애플리케이션을 제공하기 위해 여러 코드와 프로그램들을 묶는 행위로 정의할 수 있다. 개발자는 최종적으로 번들링된 웹 애플리케이션을 만들어내고, 사용자가 웹 애플리케이션을 이용할 때는 번들링한 파일을 받아와 브라우저가 이 번들을 실행한다. 번들링이 없던시절 문제점은? 두 개의 .js 파일에서 같은 변수를 사용하고 있어서, 변수 간 충돌이 일어났다. 한 번 불러오는 프레임워크 코드가 8MB라서, 인터넷 속도가 느린 국가의 모바일 환경에서 사용자 불편함을 겪음. 번들 파일 사이..

브라우저의 특징과 웹의 동작 원리 브라우저는 현존하는 브라우저끼리 조금씩 그 특징이 다르지만, 공통점이 하나 있습니다. 그것은 바로 동작 방식입니다. 브라우저는 사용자가 선택한 자원(Resource)를 서버에 요청(Request)하고, 서버의 응답(Response)을 브라우저에 띄우는(Rendering) 방식으로 동작합니다. 여기서 자원은 대개 HTML 문서이지만 가끔 PDF, 멀티미디어 등 다른 형태일 수 있으며, 자원의 주소는 URI(Uniform Resource Identifier)로 되어 있습니다. 먼저, 사용자가 웹 브라우저를 통해 찾고 싶은 웹 페이지의 URL 주소를 입력합니다. 그러면 DNS 서버에서 사용자가 입력한 URL 주소 중 도메인 네임을 검색합니다. 그리고 해당 도메인 네임에 해당하..