본문 바로가기

Computer Science

 (11)
CSR vs SSR 1. 웹의 역사(SPA 시대까지) 1/ 1990년 중반까지는 모두 다 static sites(정적 사이트)였다. 서버에 이미 잘 만들어진 html 문서들이 있고, 사용자가 브라우저에서 www.hello.com과 같은 주소에 접속하면 서버에 이미 배포되어져있는 HTML 문서를 받아와서 보여주는 형식 한가지 문제점은, 페이지 내에서 다른 링크를 클릭하면 (www.hello.com/about) 다시 서버에서 해당 페이지의 HTML을 받아와서 페이지 전체가 업데이트 되어야 한다. 2/ 1996 1996년 문서 내에서 또 다른 문서를 담을 수 있는 iframe 태그가 도입되었고, 이제는 페이지내에서 부분적으로 문서를 받아와서 업데이트 할 수가 있게 된다. (지금도 간혹 쓰이고 있는 태그!) 3/ 1998년 우리가..
명령형 프로그래밍 vs 선언형 프로그래밍 Imperative programming is HOW you do something, and declarative programming is more like WHAT you do. 즉, 명령형(절차적) 프로그래밍 : 일을 '어떻게' 할 것인가에 관한 것. 선언적 프로그래밍 : '무엇을' 할 것인가에 관한 것. 아래는 코드가 아닌, real life 예시. 1/ Red Lobster 레스토랑 - 당신은 JavaScript가 주는 피로함과 씨름하느라 많은 시간을 써, 남편과 근사한 데이트를 하기로 결정했습니다. Red Lobster에 도착하여 프론트데스크에 가서 다음과 같이 말하였습니다. [ 명령형 접근형(HOW) ] I see that table located under the Gone Fi..
'빌드'란? # 빌드란? 작가들이 책을 쓸 때는 챕터마다 워드파일들을 만들고, 수많은 사진 및 참고자료들을 다루면서 작업을 하다가 이를 책으로 낼때는 PDF파일 하나로 묶어서 공개한다. 프로그래밍도 마찬가지이다. 소프트웨어는 보통 몇백줄 코드로 되는게 아니기 때문에 개발자가 작업하는 프로젝트는 일반적으로 수십, 수백개가 넘는 폴더와 파일들로 이루어져있다. 이중에는 개발자가 작성하는 코드파일들도 있고, 다른 곳에서 작성한 코드들(즉, 라이브러리들), 그리고 이미지나 기타 소프트웨어에 필요한 파일들이 포함된다. 소프트웨어의 특성마다 다르지만, 일반적으로는 이를 출시할 때에는 이들을 다른 형태로 변형 또는 압축해서 내보낸다. 이를 '빌드한다'라고 한다. # 빌드 목적 빌드를 하는 목적과 이유는 다양하다. 윈도우의 .ex..
Virtual DOM(가상돔) 리액트가 수많은 개발자들 사이에서 사랑받는 이유 중 하나는 바로 빠른 속도. 리액트는 Virtual DOM을 이용해서 보다 효율적으로 원하는 페이지를 브라우저에 그려준다. # DOM이란? 브라우저를 통해 어떤 웹사이트를 들어가면 제목도 있고, 버튼도 있고 사진도 있다. 이런 하나하나의 요소들을 element라고 부른다. 그리고 이 모든 것을 담고 있는 웹페이지를 문서, document라고 부른다. 브라우저는 이 페이지에 해당하는 HTML을 분석해서 화면에 띄워준다. DOM은 이렇게 웹페이지에 들어가있는 element들을 tree형태의 구조로 표현한 것. html이 이렇게 작성되어서 브라우저상에 올라왔다면 DOM은 오른쪽과 같은 구조를 가지고 있다. DOM 트리 안에는 각각의 elemet에 상응하는 nod..
네이티브 앱 vs 크로스플랫폼 앱 vs 모바일웹앱 vs 하이브리드 앱 공부를 하다가 네이티브 앱/크로스플랫폼 앱/모바일웹 앱/하이브리드 앱의 차이를 정확하게 몰라 찾아서 정리를 하였다. # 네이티브 앱 (Native app) - 우리가 일반적으로 앱스토어(iOS-아이폰)나 구글플레이스토어(Android-삼성폰)에서 다운받아서 쓰는 앱을 의미한다. - 모바일기기에 최적화된 언어로 개발된 앱으로, 안드로이드 SDK를 이용해 Java, Kotlin 등의 언어로 만든 앱, iOS기반 SDK를 이용해 Swift로 만든 대부분의 앱을 의미. 안드로이드 iOS 개발환경 안드로이드 스튜디오 XCode (현재) 프로그래밍 언어 코틀린(Kotlin) 스위프트(Swift) (과거) 프로그래밍 언어 자바(Java) 오브젝트-C(Object-C) - 이렇게 각 OS에 맞는 언어로 iOS 앱개발자..
컴파일러 vs 인터프리터 컴퓨터는 0과 1이란 신호들을 사용해서 돌아간다. 때문에 컴퓨터가 알아듣는 명령어들은 0과 1의 기나긴 조합들로 되어있다. (사람이 이걸로 프로그램을 짜려면 죽어난다...) 때문에 오늘날 널리 사용되는 프로그래밍 언어들은 사람들이 보다 알아보고 작성하기 수월하도록 설계돼있다. 나날이 쉬워지고 간결해지고 기능도 강력해지는 언어들 덕분에 손쉽게 코딩을 할 수 있다. 하지만 기계들은 이 코드들을 알아보지 못하기 때문에 이를 기계들의 언어로, 또는 그 중간 단계로 번역해주는 작업이 필요하다. 이걸 언제 하느냐에 따라 컴파일러/인터프리터 둘 중 한 범주에 들어가게 된다. # 컴파일러 C, C++, 자바 등의 언어들은 개발자가 코딩을 마치고 완성된 프로그램을 출시하는 단계에서 컴퓨터에게 일을 하나 시킨다. 이 일이..
객체지향 프로그래밍에 대해서 # 객체지향 프로그래밍이란? 객체지향 프로그래밍은 프로그램을 명령어 또는 함수의 목록으로 보는 전통적인 명령형 프로그래밍의 절차지향적 관점에서 벗어나, 여러 개의 독립적 단위, 즉 '객체'의 집합으로 프로그램을 표현하려는 프로그래밍 패러다임을 말한다. ### 프로그래밍 패러다임이란? 여기서 잠깐! '프로그래밍 패러다임'은 도대체 뭘까? - 패러다임 : 특정 분야에서의 사고 방식이나 문제 해결을 위한 체계적인 접근 방법 - 프로그래밍 패러다임 : 특정 프로그래밍 언어나 기술의 사용 방법, 코드의 구조화, 문제 해결 방법 등에 대한 전반적인 철학이나 접근 방식. => 이해는 가는데 딱 정의하기는 조금 어려워, 내가 나름대로 내린 정의는 '프로그래밍 표현 방법론 또는 구현 방식(스타일)'. ## 객체지향 프로..
웹 서버 웹 서버는 웹 브라우저와 마찬가지로 제품'군'이다. 웹 브라우저 : 제품'군' 웹 브라우저의 다양한 제품 : Chrome, Safari, Internet Explorer etc.. 웹서버 : 제품'군' 웹 서버의 다양한 제품 : Apache, IIS, Nginx, Live Server 등등. # Liver Server 웹 서버의 제품 중 하나가 바로 Live Server!! - Visual Studio Code의 확장 기능. 아주 유명하고 잘나가는 웹 서버. ## Live Server 켜는 방법 1/ index.html을 오른쪽마우스 클릭 → 'Open with Live Server'를 클릭. 2/ 맨 아래 'Go Live'를 클릭 → Live Server가 켜지면서 'Port: 5500' 이렇게 바뀐다..

티스토리툴바