IT 일기 / 뷰포트 메타 태그 (viewport meta tag) & jQuery 연결하기
[ 재미있는 IT 일기 🖤 ]
문득 이런 궁금증이 들었다.
캐나다에 있었을 때 (2015-2016년도) 인터넷 익스플로러를 사용했었나...? 왜 우리나라만 인터넷 익스플로러를 사용했을까?
물론, Internet Explorer는 Window10이 나오자마자 기본 브라우저 값들이 Edge로 옮겨졌고, 지원이 종료되었지만 여전히 사용은 가능하다.
(정치와 연관이 있을진 모르겠지만) 느리고 보수적으로 움직이는 법에 반해, 누구보다 빠르게 돌아가는 IT기술이었기 때문에 법조계에선 IT기술을 규제하려다보니 당시엔 진보가 멈췄었다고 한다. IT 발전 속도가 빠르면 신생기업이 생겨나고, 기존 기업들은 신규기술에 적응해야 하기 때문에 기득권을 지키고 싶었던게 아니었을까.
2000년대 초반에 개발자 연봉이 저세상으로 뛰니까 2006년 즈음에 개발자를 파견이 가능하도록 바꾼 법이 '개발자 파견법'이다. 컴공과 친구들이 먹고살 기반을 없애버렸던 법조차 등장하게 된 것이겠지...? 속된말로, 기업인들 머니를 지켜야 하기 때문이다.
.
.
.
그래서 국내 SW기술의 발전이 되지 않았던 것이다. 거기에 더해서, 정부사업 같은 경우는 '전자정부프레임워크'라고 만들어 java/spring 만 쓰도록 했다. python에서 동작하는 django, javascript로 쓸 수 있는 Express, koa, ruby 언어로 동작하는 ruby on rails, 그리고 php로 동작하는 라라벨 등... 수도없이 많은데- 정부사업관련해서는 쓰지 않는다.
전자정부 표준프레임워크가 존재하는 마당에, 다른 프레임워크를 써서 정부 관리자들의 눈엣가시에 걸릴 필요는 없기 때문이지 않을까 싶으면서도- 기술은 경쟁하면서 발전하는 건데 하나의 기술만 존재하는 건 문제가 있지 않을까...? 물론, spring은 안정적인 프레임워크이며 spring만 잘 다뤄도 어느나라를 가든 먹고 사는데 지장은 없다고 한다.
다른 나라 백엔드를 보면 언어가 굉~장히 다양한데- 유독 국내는 java가 많다는 재밌는 사실(:
자그럼 다시 질문으로 돌아가서-!
외국에 있었을때 인터넷 익스플로러를 사용했었나...? 왜 우리나라만 인터넷 익스플로러를 사용했을까?
생각해보니, 처음 맥 프로 레티나13 2015를 구매했을 당시- 부트캠프를 설치한 이유가 '공인인증서'와 '은행' 이용 때문이었다.
공인인증서가 태어날 때만 해도, 암호화 기술을 미국에서 공개하지 않았기 때문에 속된 말로, 한국에서 아! 그럼 우리가 자체 암호화를 하자! 해서 자체 공인인증서 기술이 만들어졌다. 물론, 암호의 역사 자체는 굉장히 복잡하지만, 고도의 암호화 기술은 미국에서 다량 보유되었다. 2000년대 초반만 해도 국내 기술자들이 만들어낸 것이 '공인인증서'인데, 현재는 거의 암호화 기술이 대부분 오픈되어 있어 누구나 사용할 수 있을 정도지만, 당시엔 그 기술을 보고 속된 말로, 와! 이거 잘 만들었네요! 금융권에선 필수로 쓰는 걸로 하죠~ 하며 법제화가 되었다는 것...+_+
문제는 공인인증서를 사용하는 기술이 Internet Explorer에서만 동작하는 ActiveX 기반으로 만들어진 기술이었기 때문에, 다른 브라우저에서는 작동하지 않았던 것이다. 2008년 9월 크롬이 탄생한 이후로 외국에선 보안 등의 문제로 IE 사용권장을 하지 않았지만- 대한민국에서는 유독, 공인인증서 명목하에 계속해서 IE를 사용했던 것이다.
언니 말론, 이런 문제를 방치한 데 있어서 국내 보안업계의 책임이 크다고 한다. 물론 익스플로러가 세기말이 되어가니, '공인' 인증서는 삭제되었지만- 아직도 인증서 개념은 남아있고 나역시 USB안에 공동인증서가 있다...(하하ㅏ) 모바일 시대는 이미 오셨고, Naver와 Kakao에서도 인증서를 만들어주셨고, 소액결제 정도는 인증서 없이도 결제가 가능하다(: 주식 역시 플랫폼을 이용하면 인증서 없이도 가능하지만- 여전히 관공서 내부 시스템은 아~직~까~지~도 익스플로러 기반이라는 팩트!
무쪼록 결론:
크로스브라우징 지원이 되는지 확인하기 위해서는 인터넷 익스플로러를 사용하겠지만, 그 외의 경우라면 사용하지 않을 것 같긴하다. 아.. 예외도 있었지 참.. 은행이용.....! (300만원 이상 거래는 무조건 공인인증서 필요하다는 것)
[ 프로그래밍 독학 노트 ]
1.
플러그인 선택할때 크로스브라우징이 잘 되는지 확인하기(:
to be honest, 제이쿼리는 크로스브라우징에 문제는 없지만- 버전에 따라 차이가 있을 수 있으므로 확인해보자+_+
지금 시점의 자바스크립트를 쓰면, Internet Explorer에서는 적용되지 않기 때문에 제이쿼리를 사용한다는게 꼭 나쁘지만은 않다. 어찌되었든... 제이쿼리를 쓰게되면 인터넷 익스플로러에서도 적용이 가능하기 때문.
2.
js폴더에는 jQuery open source 파일 + 웹을 만들기 위해 사용한 jQuery plugin들을 폴더별로 정리.
참고로, source폴더는 FTP에 올라갈 아이가 아니다.
3.
반응형 웹을 만들기 위한 필수적인 meta tag(:
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0">width=device-width
-> mobile device에 맞춰서 만들어진다는 뜻.
initial-scale=1
-> 맨처음 모바일에서 스크린이 떳을때 크기를 100%로 하겠다는 의미. (값은 0~10사이까지 적용 가능)
*meta:vp + tab
-> viewport 메타 태그 에밋 단축키.
user-scalable=no
-> 모바일에서 손가락으로 줌인 아웃할때 유저가 하지 못하게끔 하겠다는 옵션. (값은 yes 혹은 no)
4.
제이쿼리 파일은 .js 파일 형태로 존재하며- 웹 페이지에서 제이쿼리 파일을 로드하기 위해서는 두가지 방법이 있다.
4-1) 제이쿼리 파일 다운받아 연결하기
<head>
<script src="js/jquery-2.1.4.js"></script>
</head>
*script:src + tab
-> js 에밋 단축키.
모든 제이쿼리 플러그인들은 제이쿼리 오픈소스가 없으면 돌아가지 않는다. + 제일 위에 위치해 있어야 한다(:
4-2) CDN 연결하기
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
CDN(Content Delivery Network)은 서버에 제이쿼리 파일을 저장하지 않고, 제이쿼리를 사용할 수 있도록 해주는 기술이다.
[ 구글의 자바스크립트 라이브러리를 사용하는 경우 ]
위에서 한가지 골라 사용(:
Hosted Libraries | Google Developers
A stable, reliable, high-speed, globally available content distribution network for the most popular open-source JavaScript libraries.
developers.google.com
**구글 이외에도 MS, jsDelivr 등의 CDN이 있다.
5.
js파일과 css파일들은 서로 종이 다른 파일이다. 때문에, 순서가 상관없을지라도, js는 js파일들끼리 순서가 굉장히 중요하며 css역시 css파일들끼리 순서가 너~~무 중요하다.
ex. pc버전의 style.css가 먼저 오고, 모바일 버전을 제어하는 css는 나중에 와야 한다.
<head>
<script src="custom.js"></script>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="responsive.css">
</head>
'IT' 카테고리의 다른 글
| 서브라임 에밋 Emmet / html attribute, list, table (0) | 2022.06.19 |
|---|---|
| 서브라임 텍스트 Sublime text3 다운 및 플러그인 설치 (0) | 2022.06.18 |
| web / html / Protocol / IP / DNS / Port (0) | 2022.06.17 |
| 비주얼 스튜디오 코드 필수 세팅 & VSC Extensions (0) | 2022.06.15 |
| 맥 M1 프로 caps lock 영문 대문자 딜레이 문제 해결 (0) | 2022.06.14 |