본문 바로가기

DEVELOP/IT

[웹] 웹 프로그래밍이란? :: 사용되는 언어들

반응형

지난 봄부터 공부하고 있는 분야는 프로그래밍이다. 이유는 재미있어서. 물론 알아두면 언젠가 도움이 될 것 같은 이유도 크다. 예전에 컴퓨터공학을 복수전공 하려고 하긴 했었다. 유학동양학과 비교하다 결국 유학동양학으로 결정하게 된 이유는, 컴퓨터는 다른 곳에서도 배울 기회가 많은 것 같아서. 나중에야 알았지만 대학에서 배우는 것과 학원 등지에서 배우는 내용의 차이는 꽤나 크다. 대학은 학원에 비해 실무에 가깝진 않지만 훨씬 깊은 이해를 준다. 그만큼 우리가 보던 컴퓨터와는 거리가 멀어보이지만 컴퓨터의 원론적 시스템을 배울 수 있달까. 반면 학원은 정말 실무자 양성이 목적.


이제 와서 학교에서 배울 수는 없고. 학원에서 제공하는 수준의 교육은 독학하는 게 더 편할 것 같았다. 사실 경제학 수업도 교수님 강의를 듣기보다는 도서관에서 이해될 때까지 책 보면서 공부했었다. 애초에 남이 강의하는 걸 잘 듣지 못하는 스타일이라서. 그렇게 혼자 프로그래밍을 공부하기 시작했다. 처음에는 C++이나 자바, 파이썬 같은 거 할 줄 알면 되는 줄 알았다. 근데 알아보니깐 프로그래밍 언어라고 하는 게 내 생각이상으로 무지 많았다. 우선 프로그래밍에 대한 이해가 필요했다.


자바 스위프트 로고


처음에는 앱을 만들고 싶었다. 근데 그것도 iOS용 개발은 오브젝티브-C나 Swift, 안드로이드는 자바가 필요하단다. 어디서 본 건 있어가지고 프로그래밍은 C 언어 아닌가 싶었는데 다른 언어에 비해 난이도도 높고 요즘은 잘 안 쓴다더라. 이런저런 글들을 읽어가면서 점점 웹에 흥미가 생겼다. 앱은 디바이스 생태계의 영향을 많이 받지만 웹은 생명력이 길 것 같아서. 쉽게 말해 애플이 망하고 사람들이 아이폰을 안 쓰면 스위프트는 무쓸모다. 하지만 웹, 보다 친숙한 개념으로 인터넷은 정보화 사회의 근간을 이루고 있다. 이미 쌓인 무수한 정보들을 싹 버릴 수는 없다. 결국 새로운 기술이 나와도 이 시스템을 발전시키지, 버리지는 않을 것이라 생각했다. 즉 중요한 건 컨텐츠, 정보라는 것. 그리고 이 컨텐츠를 다루는 기술이 웹이다. 나아가 웹 기술 중 일부는 앱에서도 사용이 된다. 이 일부의 기술이 당분간 정리하려고 하는 HTML과 CSS다. 그리고 JavaScript.


HTML CSS JavaScript 로고



HTML과 CSS. 쉽게 말해 각각 컨텐츠를 담는 통과 컨텐츠를 꾸미는 장식이다. 크롬, 파이어폭스, 익스플로러 등의 웹 브라우저는 HTML과 CSS 파일을 읽고 그 내용을 보여주는 프로그램이다. HTML에는 정보의 내용이 담기고 CSS에서는 그 내용을 화면에서 어떻게 보여줄 것인지 정의한다. 이게 웹 기술의 핵심이다.


HTML은 HyperText Markup Language, 하이퍼텍스트 마크업 랭귀지. 말 그대로 하이퍼텍스트를 마크업하는 언어다. 그럼 하이퍼텍스트는 뭐냐. 하이퍼링크다. 각각의 페이지를 링크하는 텍스트. 즉 하이퍼텍스트를 배치하여 내용과 구성을 표시하는 데에 사용되는 언어. CSS는 Cascading Style Sheet, 캐스케이딩 스타일 시트. 역시 이름 그대로 위에서 아래로 흐르는 방식의 스타일 시트. 엄밀히 말히 이 HTML과 CSS로 페이지를 짜는 것은 프로그래밍은 아니다. 요즘 자주 들리는 코딩의 영역에 포함되긴 한다. 하지만 프로그램, 즉 알고리즘을 짜는 게 아니라 컨텐츠를 배치하고 꾸미는 것에 불과하다. 그만큼 문법만 알면 작업물을 만드는 건 어렵지 않기 때문에 어디 가서 나 코딩 할 줄 안다고 말하고 싶다면 HTML과 CSS부터 배우면 된다.


웹에서 중요한 또 다른 기술은 자바스크립트(JavaScript). 사족이지만 자바와는 아무 관계없다. 그냥 자바가 인기가 많아서 편승하려고 이름을 따왔을 뿐이다. 여기는 프로그래밍의 영역이다. 사이트를 동적으로 꾸미고 싶거나 웹앱을 만들 때 필요하다. 즉 웹상에서 서버와 호출하거나 알고리즘대로 결과물을 출력하고 싶을 때 필요한 언어. HTML과 CSS 포스팅이 완료되면 자바스크립트 공부 내용도 정리하려고 한다. 동시에 할 수도 있는데 욕심은 안 부리려고 한다.


이 자바스크립트에서 자주 쓰이는 기능을 정리해둔 것이 제이쿼리(jQuery). 이건 언어는 아니고 자바스크립트의 라이브러리다. 겉으로는 꼭 다른 언어처럼 포장되어 있지만, 그 내부에는 자바스크립트가 돌아가고 있다. 자바스크립트의 a, b, c의 구문을 직접 타이핑하는 대신 a, b, c를 A라는 구문 안에 집어넣어서 A를 호출하는 방식이다. 일종의 치환이랄까. 당연히 자바스크립트에 비해 훨씬 단순해서 웹 디자인에서 유용하게 쓰인다. 하지만 복잡한 프로그래밍을 위해선 당연히 자바스크립트를 알아야 한다.


Python php 로고


나아가 파이썬이나 php도 웹에서 사용되는 언어이다. 서버 측에서는 node.js나 asp, jsp 등 무수히 많은데 일단 여기는 나도 잘 모르는 영역이니까 보류. 파이썬 문법은 배우긴 했는데 어떻게 활용되는지는 아직 잘 감이 안 온다. 차근차근 공부해나가야겠다. 우선 블로그에는 프론트엔드 영역부터 정리하려고 한다. 참고로 브라우저에 보이는 화면처럼 사용자와 접하는 부분이 프론트엔드. 반대로 서버에서 돌아가는 부분은 백엔드라 부른다. 클라이언트=프론트엔드, 서버=백엔드라 생각하면 된다. 다음 포스팅에서 본격적으로 HTML과 CSS가 무엇인지 이야기하며 시작해야겠다.

반응형