다양한 프로그래밍언어가 존재하는 이유
각 프로그래밍언어마다 지향하는 바가 다르고, 각기 다른 용도로 사용되어지기 때문.
예를들어 Node.js 같은 경우는 실시간으로 빠른 처리가 요구되는 채팅서비스, Spring Framework와 같이 객체지향처리가 필요한 경우 등 다양한 이유로 사용, 선택되어지는 언어가 다름.
인터프리터와 컴파일러
| 컴파일러 | 인터프리터 | |
|---|---|---|
| 개발 편의성 | 코드를 수정하고 실행하려면 컴파일을 다시 해야 한다 | 코드를 수정하고 즉시 실행할 수 있다 |
| 실행 속도 | 빠르다 | 느리다 |
| 보안 | 프로그램의 코드가 유출되지 않는다 | 프로그램의 코드가 유출될 수 있다 |
| 파일 용량 | 프로로그램의 실행 파일 전체를 전송해야 하므로 용량이 크다 | 프로그램의 코드를 전송하면 실행이 되므로, 용량이 작다 |
| 프로그래밍 언어 | C, C++처럼 비교적 저수준에 가까운 언어 | Python, Ruby처럼 비교적 고수준에 가까운 언어 |
JAVA에서는 어떨까?
해당 내용은 마이크로소프트 시니어 백엔드 개발자인 백기선님과 2021년 말에 스터디 하면서 배웠던 내용이다. 이전에도 포스팅한 경험이 있지만, 컴파일러와 인터프리터를 모두 사용하는 신기한 언어이기 때문에 기억에 남아있어서 정확하게 다시 되짚을 겸 다시 포스팅한다. 경험상 기업 기술면접에서 종종 물어보는 곳도 있었음.
자바를 이용하여 개발하는 개발자라면 누구나 자바 바이트코드가 JRE 위에서 동작한다는 사실을 잘 알 것이다. JRE에서 가장 중요한 요소는 자바 바이트코드를 해석하고 실행하는 JVM이다. JRE는 자바 API와 JVM으로 구성되어 있으며, JVM의 역할은 자바 애플리케이션 로터(Class Loader)를 통해 읽어 들여서 자바 API와 함께 실행하는 것이다. 이론적으로 모든 자바 프로그램은 CPU나 운영 체제의 종류와 무관하게 동일하게 동작할 것을 보장한다.
자바로 작성된 애플리케이션은 모두 이 가상 컴퓨터(JVM)에서만 실행되기 때문에, 자바 애플리케이션이 실행되기 위해서는 반드시 JVM이 필요하다. 일반 애플리케이션의 코드는 OS만 거치고 하드웨어로 전달되지만, Java 애플리케이션은 JVM을 거친 후 OS를 거치기 때문에, 그리고 하드웨어에 맞게 완전히 컴파일된 상태가 아니고 실행 시에 해석(interpret)되기 때문에 속도가 느리다는 단점이 있다. 최근에는 바이트코드를 하드웨어의 기계로 바로 변환해주는 JIT 컴파일러와 향상된 기술이 적용되어 속도의 차이를 크게 줄였다.
일반 애플리케이션은 OS와 바로 맞붙어 있어서 OS에 종속적이다. 그래서 다른 OS에서 실행시키기 위해서는 애플리케이션을 그 OS에 맞게 변경해줘야 한다. 반면에 Java 애플리케이션은 OS와의 사이에 JVM이 있어서 JVM하고만 상호작용을 한다. 그래서 OS와 하드웨어에 독립적이라 다른 OS에서도 프로그램의 변경 없이 실행할 수 있다. (단, JVM이 OS에 종속적이기 때문에 해당 OS에서 실행 가능한 JVM이 필요하다) 이렇게 함으로써 자바의 중요한 장점 중의 하나인 "Write once, run anywhere"가 가능하게 된다.
Add-On
- Prettier 자동으로 코드의 스타일을 관리해주는 도구. 가령, 문자열을 사용 할 때 ' 를 쓸지 " 를 쓸지, 또는 세미콜론 (;) 를 코드 뒤에 붙일지 말지, 들여쓰기는 얼마나 할지, 이런 것들을 관리해줄 수 있음
- ESLint JavaScript, JSX의 정적 분석 도구로 오픈 소스 프로젝트. 코드를 분석해 문법적인 오류나 안티 패턴을 찾아주고 일관된 코드 스타일로 작성하도록 도와줌.
- Live Server LIVE SERVER는 말그대로 새로고침하지 않아도 저장할때마다 실시간 라이브로 반영되어 변경사항을 바로 확인할 수 있음. 브라켓에도 비슷한 기능이 있었던 것 같은데 요즘 브라켓이 맥을 못추려서…
HTML 구조
- HTML5 문서는 반드시 <!DOCTYPE html>으로 시작하여 문서 형식을 HTML로 지정
- 실제적인 HTML 문서는 2번째 행부터 시작 <html>과 </html> 사이에 작성
- <head>와 </head> 사이에는 문서 제목, 외부파일의 참조, 메타 데이터의 설정 등이 위치, 해당 정보는 브라우저에 표시되지 않음.
- <body>와 </body> 사이에는 웹 브라우저에 출력되는 모든 요소들이 위치하게 됨.
HTML 기본 문법
요소(Element)
<p>My cat is bert grumpy</p>- <p>라는 opening tag와 </p>라는 closing tag 사이에는 content가 위치하게 됨.
- HTML 요소는 시작태그와 종료 태그 그리고 태그 사이에 위치한 컨텐츠로 구성 됨.
중첩(Nested)
<!DOCTYPE html>
<html lang="en">
<head>
<title>KDT</title>
</head>
<body>
<h1>Headline</h1>
<p>Hello KDT World!</p>
</body>
</html>- <html></html>은 웹페이지를 구성하는 모든 요소들을 포함한다.
- 예제코드를 보면 <html>은 <body>를 포함하며 <body> 요소는 <h1>, <p>를 포함
- 중첩 관계(부모자식 관계)로 웹페이지의 구조를 표현한다.
속성(Attribute)
- 속성이란 요소의 성질, 특징을 정의
- 속성은 요소에 추가적 정보(예를들어 이미지 파일의 겨올, 크기 등)를 제공한다.
빈 요소(Empty)
- 내용이 없는 빈 요소(가질 수 없거나, 필요 X)
- 빈 요소는 내용이 없으며, 속성만 보유
- 예를 들어 <meta>가 빈 요소 중 하나
- 검색 키워드, 설명, 저자 등의 데이터를 설정
- <br>, <hr>, <img>, <input>, <link>, <meta> 등이 존재
주석(Comments)
<!DOCTYPE html>
<html lang="en">
<head>
<title>KDT</title>
</head>
<body>
<h1>Headline</h1>
<!-- 이건 주석입니다. -->
<p>Hello KDT World!</p>
</body>
</html>- 주석은 개발자에게 코드를 설명하기 위해 사용
- 브라우저는 주석을 화면에 표시하지 않음
- <!— —> 사이에 코멘트하고 싶은 내용을 입력하여 사용
주요 태그 정리
- 제목 태그 <title></title>
- 문서 제목 태그, <h1~h6></h1~h6>
- 제목을 뜻하는 Heading의 약자, h사용
- 자동 줄바꿈! 왜? 제모깅니까!
- 하나의 HTML 문서에는 하나의 h1 태그를 권장
- 웹 검색 엔진이 제일 먼저 검색하는 태그!
- 본문 태그, <p></p>
- 줄바꿈 태그, <br>
- 형식화 된 글자, <pre></pre>
- 형식화의 약자 <pre>를 사용
- 우리가 에디터에 쓴대로 웹에서도 보여줌
- <br>, 을 사용해도 같은 효과를 줄 수 있지만 귀찮…
- 정리의 왕, <ul></ul> or <ol></ol>
- <ul> 순서가 없는 목록
- <ol> 순서 있는 목록
- <ol>은 속성 사용 가능
- <ol type=”?”> : 말머리 기호 변경(1, A, a, l, i)
- start 시작값 변경
- reversed 순서 변경
- 수평 줄 <hr> 수평으로 된 줄을 하나 그어 줌
- 문자 꾸미기 태그들 <b> : 두껍게 <string> : 두껍게 <i> : 이탤릭 <em> : 강조 <del> : 가운데줄 <u> : 밑줄
- Semantic Web
- 태그 자체로 컨텐츠에 대한 의미를 명확하게 설명할 수 있는 것
- 개발자가 의도한 요소의 의미가 명확하게 나타남
- <header>, <footer>, <img>, <title> 등등
- 검색 엔진이 웹 페이지를 검색할 때, Semantic 요소를 검색
- 이미지를 넣고 싶어?, <img>
- 이미지를 넣을 때 사용!
- 속성 값 중 하나인, src를 사용
- 파일을 직업 가져오기도 하고, url을 통해서 넣어줄 수도 있음
