[알쓸 IT] HTML/CSS/JavaScript

📢 개요

HTML/CSS/JavaScript(Js)

오늘날의 HTML, CSS, JavaScript(JS)는 "웹사이트", 즉 브라우저에서 동작하는 소프트웨어에만 국한되어 있지 않습니다. 

React Native나 Native Script처럼 혹은, 비슷한 변형들로, "모바일 앱"을 만드는 기술들이 이미 널리 사용되고 있습니다.

Electron.js 같은걸로 이젠, 웹사이트가 아닌, "컴퓨터 프로그램"까지 HTML/CSS/JS로 만들 수 있게 되었습니다. 😮

 

📢 HTML/ CSS / JavaScript

사실상, HTML(Hyper Text MarkUp Language) , CSS(Cascading Style Sheets)는 사실 프로그래밍언어에도 속하지 못합니다..

• HTML은 "마크업(Markup)"언어입니다.
  
  👉 화면에 "어떤 요소들이 놓여 있어라 !" 하고 갖다놓는 수단
  
  
• CSS는
  
  👉 HTML을 통해 띄어놓은 요소들이, "이렇모양, 저런 색 등으로 보여라 !"하고 정해주는 수단
  
  
• JavaScript만이 그나마(?) 프로그래밍언어 속합니다. 
  
  👉 원래는 브라우저에서 웹사이트를 돌리는 목적으로 만듦, 그래서 그닥 대우를 못받는 언어였습니다.
  👉 그러나, 계속 발전을 하고, 특히 Node.js가 이것을 브라우저 바깥 세상으로 꺼내오면서, 위상이 아주 높아졌다.
  👉 웹사이트에서 돌아가는 JS는 브라우저에서 다양한 일을 수행하고, HTML로 올려놓은 요소들을 변형시키거나, 직접 만들어내기까지 합니다. !! 😮

📝 HTML / CSS / JavaScript 문서들이 합쳐져서, 하나의 웹페이지가 구동한다면,

• HTML = "갖다놓고"
• CSS = "꾸미고"
• JavaScript = "시킨다."

라고 생각합시다. 

 

📢 마무리

HTML / CSS 는 배우는 건 쉽지만, 숙달이 되려면 시간이 좀 필요합니다.

같은 구조와 모습도, 구현하는 방법이 다양한데, 어느쪽이 효율적이고, 여러 환경이나 기기에 유연하게 적용 가능한지는 많이 만들어보고, 직접 봐야 느낄 수 있습니다.

매우 유명한 사이트, 예를 들면, "네이버" 나 "다음", "구글" 같은 사이트가, 어떻게 구성되어 있는지, "크롬 개발자 도구 같은 툴들로 분석해보면, 좋은 방법론들을 많이 얻을 수 있습니다. 👍👍👍

오른쪽화면이 "크롬 개발자 툴 (F12) 누르면 된다.

자바스크립트는 현재도 빠르게 변화해가고 있는 언어이다 보니, "끊임없이" 공부할 것이 생긴다고 합니다. 😂

예전에는 대부분이 "JQuery" 라는 강력한 "라이브러리" 로 순수 자바스크립트보다 훨씬 편하고, 쉽게 코딩을 하곤 했는데, 요즘은, 자바스크립트 자체가 파워풀해지고, JQuery의 성능문제도 있어서,,,

프론트엔드 프레임워크 같은 새로운 개발 방식들이 나오면서 "JQuery를 더 이상 쓰지말아야한다." , "없애야 한다" 라는 말이 나오고 있다고 합니다. 🙄

프론트엔트 Framework 들 ( 순서대로, React, Angular, Vue.js )

입문자들은, 우선 "JavaScript"를 탄탄히 먼저 배워놓은 다음, 위에서 언급한 라이브러리나 프레임워크를 필요에 따라, 배워나가면 좋을 것입니다.

웹 사이트를 만들 때, 기억해야 할 것은, HTML,CSS,자바스크립트의 최신 기술들을 전부 공부해서 이용하려면 곤란하답니다. 😅

웹사이트는 어디까지나, 크롬(Chrome), 사파리(Safari), 파이어폭스, 익스플로러  같은, "웹 브라우저"에서 구동하는데, 이 브라우저들 중, 일부에서 최신 기술들을 지원하지 않거나, 혼자 이상하게 돌아가는 경우( 익스플로러..🤬 )가 있기 때문에, 사람들이 어떤 버전의, 어떤 브라우저를 얼마나 사용하고, 그것들이 지원하는 기능들은 어디까지인지

즉, 📝 "호환성"을 확인하고, 테스트해가면서, 개발하는 것이 중요합니다. 

 

 

미흡하거나, 잘못된 정보가 있다면, 문의해주세요. 🙏

---