Lecture | HTML & Internet
👻 수업소개
이번 수업에서는 여러분의 상상력이 필요합니다.
남의 문제를 위해 코딩을 배우려는 게 아닌, 나의 문제를 코딩으로 해결하려는 엔지니어라고 상상을 해보자. 어떤 문제를 해결할까? 해결하고 싶은 문제가 없다면 빌려드리겠다! 7년 전의 egoing이 되어보자. 과장해서, 크게, 공감을 해보라!
공부로 인해서 나의 삶의 문제에서 해방된다면, 공부의 효용을 뇌에게 증명하게 된다면, 우리의 뇌는 공부를 좋아하게 될 것이다. (공부가 삶의 문제가 되어버린다면 힘들 것이다. 정말 그렇다!) 노력하지 않고도 공부거리를 찾게 될 것이다. 실력은 자연스럽게 좋아지게 된다. 지식을 알려주기보다는 공부와 친해지는 계기가 되었으면 좋겠다. 가봅시다!🤗
👩🏫
1. 프로젝트 동기 & 기획
동기
프로그래머로 일하던 시절, 동료들에게 코딩 수업을 하기 시작했다. 반응이 좋았고 일반인들을 대상으로 규모가 커졌다. 문제라고 느끼는 지점들이 생겨났다. 같은 이야기를 반복해야 했고, 멀리있는 사람들은 참석하기 어려웠다.
그즈음 youtube나 vimeo같은 무료 온라인 동영상 서비스들이 생겨나기 시작했다. 그리고 HD 화질을 지원하기 시작했다. 얇은 글씨를 영상으로 표현할 수 있게 된 것이다. 교육역사에도 획기적인 사건이었다. egoing은 동영상으로 수업을 만들기 시작했다.
그런데 문제가 생겼다. 분량이 많은 코딩 수업 영상을 5-10분 가량 쪼개서 만들었는데, 선/후 관계 정리가 어려웠고 보충자료를 보여주기가 어려웠다.
그래서, eoging은 직접 만들기로 결심한다.
기획
무엇인가를 만들기 전에, 무엇을 만들지 미리 상상해서 계획하는 것을 기획이라고 한다. 수업과 내용을 정리정돈한 웹사이트를 종이에 그려보자!
2. 코딩과 HTML
어떤 쪽이 사람이 하는 일이고 어떤 쪽이 기계가 하는 일인지 분리해야 한다. 어떤 것이 원인이고 결과인지 추론하는 것이 중요하다.
원인(사람이 하는 일) | 결과(기계가 하는 일) |
---|---|
코드 | 애플리케이션(앱/응용프로그램) |
소스 | 프로그램 |
컴퓨터 언어 | 웹페이지, 웹사이트 |
관점에 따라서 부르는 이름이 다양하다.
코딩
원인인 코드를 통해서 결과를 만든다는 것
이 코딩이다. 세상엔 여러 종류의 코드가 있는데, 웹페이지를 만드는 코드가 HTML
이다.
HTML이 중요한 이유?
- 쉽다 : 이 언어의 문법을 배우는데 10분도 걸리지 않는다.
- 중요하다 : 인류가 생산하는 디지털 정보가 담기는 그릇이 웹페이지다. 우리는 하루에 웹페이지를 100번도 넘게 보게 된다.
웹의 장점
웹을 만든 팀 버너스는 웹을 퍼블릭 도메인(저작권이 없음)으로 선언했다. 그래서 우리는 다양한 웹브라우저로 같은 웹페이지들을 볼 수 있다. 웹은 특정 기업이 독점하지 않기 때문에 1990년 이후로 지금까지 살아남았고, 앞으로도 살아남을 가능성이 매우 높다.
3. HTML 코딩 실습 환경 준비
준비물
- 웹브라우저
- 에디터 : best HTML Editor 20XX을 검색해서 최신 에디터를 찾아보라. 수업에서는 Github에서 만든 Atom을 사용하겠다.
순서
- 실습 파일을 저장할 폴더를 생성한다.
- html 파일을 생성한다.(웹브라우저가 볼 수 있는 웹페이지의 확장자명)
- 웹브라우저에서 Ctrl + O 단축키를 누르면 파일을 열 수 있다.
⚡ 웹페이지를 열 때, 브라우저 주소창에 주소를 입력했었다. 왜? 내 컴퓨터가 아닌 그 주소에 해당하는 다른 컴퓨터에 저장되어 있는 웹페이지를 읽고 싶을 때는 주소를 입력
했던 거다. 우리가 지금 하는 것은 브라우저와 같은 컴퓨터에 있는 파일을 읽으려고 하니 파일 열기를 하는 거다.
4. 기본문법 태그
내가 좋아하는 것 <br />
<strong>내가 <u>싫어하는</u> 것</strong>
태그
웹을 지배하는 (세상에서 제일 쉬운) 중요한 문법. 우리가 위에서 사용한 것을 태그라고 한다. 앞에 있는 태그를 열리는 태그, 뒤에는 닫히는 태그라고 한다. 왜 태그일까? 일상 속에서의 태그를 상상해보자. 태그는 여러분의 옷을 설명
해준다!
컴퓨터 공학은 하나의 거대한 시다.
컴퓨터 공학이나 프로그래밍을 공부하면 용어들이 어렵고 힘들게 느껴질텐데 그럼 사전을 찾아보고 뜻을 찾아보면 우리 일상과 밀접한 관계일 용어일 가능성이 높다.
컴퓨터 공학은 하나의 거대한 시라고 할 수 있다. 물질을 기반으로 하지 않고 논리를 기반으로 하기 때문에
컴공에서 만든 것들을 설명해주고 사람들이 손에 잡히는 것처럼 받아들이게 하기 위해서는 여러 비유나 은유
를 쓰는데 그건 시와 굉장히 유사하다.
개인적으로 이 표현 정말 좋다! 앞으로 공부하면서 컴퓨터 공학이 시와 비슷한 부분을 계속 찾아나가고 싶다. 컴퓨터 공학에서 사용하는 비유와 은유를 알고 싶다.
5. 혁명적인 변화
처음에 배우는 것은 쉽지만 중요하다. 우리는 단지 HTML의 기분 문법인 태그를 배웠다.
<h1>heading level 1</h1>
우리는 여기에서 h1이 무엇인지는 모르지만 태그라는 것은 안다. 무엇을 모르는지 안다면, 검색할 수 있다.
🔎 HTML h1 tag
먼저 예제를 보고 그 다음에 정의를 보았다. 경험해 본 후에 스스로 궁리하는 과정이 더 귀중하다고 생각한다. 무언가를 알기 위해 수단과 방법을 가리지 말아라.
기초만으로도 많은 것을 알 수 있다.
우리가 얼마나 놀라운 시대에 살고 있는가를 낯설게 바라보자. 웹이 등장하지 않았다면 웹페이지도 없었을거고, 검색엔진이 존재하지 않았을 거다. 그렇다면 h1태그가 무엇인지 알려면 도서관에 가서 책을 찾고 돌아오는 그런 과정을 겪었을 것이다.
지금의 우리는? 마음만 먹으면 1분 안에 우리가 원하는 지식들을 검색할 수 있다.
세상은 점점 무엇을 모르는지만 알고 있다면 이미 (빠른 검색으로) 아는 것이나 다른 없는 상태로 나아가고 있습니다.
오늘날은 기초만으로도 많은 것을 할 수 있는 시대가 되고 있습니다. 기초만 알아도 모르는 것은 기계가 알려주고, 못하는 것은 기계가 해 주거든요.
6. 통계에 기반한 학습
태그 다 외워야 하나?
오늘날의 html에는 150개 이상의 태그가 존재한다. 이걸 다 외울 필요는 없다. 우리는 혁명적인 변화를 통해 태그가 무엇인지 알 수 있다면, 모든 태그를 다 아는 것과 다름 없다. 1분이면 찾을 수 있다.
하지만 태그를 하나도 모르면 불편하다. 어떤 태그에는 약간의 지식이 필요하기도 하다. 기본 밑천으로 알고 있으면 편리한 태그를 통계를 기반으로 보여주어, 스스로 판단
할 수 있게 하겠다.
전 세계의 웹사이트가 몇 종류의 태그로 이루어져 있는지 보여준다. 25-26개의 태그를 사용하는 사이트가 가장 많다는 걸 알 수 있다.
위의 그래프는 태그별 인기도다. 무엇을 배울 때, 통계를 기반으로 학습하시길 바란다. Web1 수업이 끝나고 난 뒤, 이 그림을 보니 여기에 나와 있는 모든 태그가 무엇인지 알 수 있게 되었다.
7. 줄바꿈
줄바꿈 태그
줄바꿈을 위해서는 태그가 필요하다. Enter로는 줄바꿈이 적용되지 않는 걸 확인할 수 있었다.
🔎 html new line tag
br 태그
- 닫는 태그가 없다. img, input, br, hr, meta 등이 닫지 않는 태그의 사례다.
- 단순한 줄바꿈을 의미한다.
🔎 html paragraph tag
paragraph 태그
- br 태그와 같은 결과를 내지만, 단락을 표현할 때는 paragraph 태그가 더 좋은 선택이다.
- p 태그는
단락이라는 정보론적 관점에서 가치
있어 지는데,시각적인 자유도가 떨어지는데, 이건 css로 만회
할 수 있다. css는 html이 표현한 정보를 꾸며준다.
<p style="margin-top:50px;">
위와 같이, css로 단락의 간격을 자유자재로 변경해줄 수 있다.
📌 우리는 81%의 빈도수를 가진 p태그와 70%의 빈도수를 가진 br태그를 살펴보았다.
8. HTML이 중요한 이유
기초는 그 자체로 중요하다
기초는 응용을 위한 전 단계가 아니라, 그 자체로도 이미 충분히 목적이 될 수도 있다.
게시판에 제목인 coding인 글을 쓴다고 상상해보자.
👉 <h3>coding</h3>
<strong><span style="font-size:22px;">coding</span></strong>
검색엔진은 웹페이지의 html 코드를 분석하고 웹페이지의 내용을 태그를 근거로 정리정돈
한다. 제목이 코딩인 사이트와 그저 내용이 코딩인 사이트 중에 검색엔진은 누구의 편을 들어줄 것인가? 무엇이 검색엔진에서 더 상단에 올라올까?
중요한 이유 2가지
-
HTML을 의미에 맞게 잘 사용하는 것은 비즈니스적인 측면에서 매우 중요하다. 정보 사회에서 검색엔진 100페이지 밖으로 밀려난다는 것은 존재하지 않는 것과 다름 없다. (
비즈니스적 관점
) -
웹은 모든 운영체제에서 작동되고 소스코드도 오픈 되어 있는 저작권이 없는 순수한 공공재다. 또한 누구나 차별없이 정보에 접근할 수 있다는 접근성의 철학이 더해진다. 가령, 시각장애인의 경우 스크린 리더 프로그램을 통해 정보를 얻는데, 이 때 HTML을 의미론적으로 잘 사용하면 커다란 도움을 줄 수 있다. HTML의 태그가 알려주는 정보를 통해 글의 구성을 보여줄 수 있다는 것이다. (
휴머니즘적 관점
)
⚡ 곱씹어볼수록 울림이 크다. 그동안 글의 제목을 나타내기 위해 폰트를 키우고 볼드처리를 했다. 이건 시각적인 장식이지 제목이라는 의미를 담고 있지는 않다. 이 글을 시각장애인들이 본다면 제목임을 인지할 수 없다. 나는 정보를 발신하면서 나도 모르게 누군가를 소외시키고 있었던 거다.
9. 최후의 문법 속성 & img
속성
태그 이름만으로는 정보가 부족하기 때문에 새로운 문법을 도입하게 되는데, 그것이 바로 속성이다.
이미지
<img src="pic.jpg" width="100%">
img 태그만 활용해서는 이미지가 보이지 않는다. 왜? 어떤 이미지를 사용할지 알려주지 않았기 때문이다.
여기에서 src라는 속성(attribute)이 등장한다.
🔎 html img size attribute
여기에서 크기를 조절할 수 있는 width라는 속성도 사용해본다.
- 내 컴퓨터에 있는 이미지나 인터넷에 있는 이미지 모두 사용할 수 있다.
- 속성의 위치는 바뀌어도 상관이 없다.
사진자료
🔎 public domain image
UNSPLASH는 대표적인 public domain image를 제공하는 웹사이트다.
10. 부모 자식 & list
<<p>
<a href="https://opentutorials.org">opentutorials</a>
</p>
이 경우는 p는 a의 부모태그이고, a는 p의 자식태그이다. 하지만 두 태그는 부모/자식 관계가 고정되어 있는 건 아니다
. 직장의 상하관계처럼 필요에 따라서 관계가 달라질 수도 있다.
고정된 부모/자식 태그
<ol>
<li>suri</li>
<li>venice</li>
<li>madam</li>
</ol>
목록을 구분할 수 있는 경계
로 사용하는 것이 ol태그
혹은 ul태그
이다. ol태그는 자동으로 넘버링을 해주는 것이 특징이다.
11. 문서의 구조와 슈퍼스타들
정보가 많아 짐에 따라 그걸 정리정돈하는 구조가 필요하다. 태그에서 가장 많이 사용되는 슈퍼스타들을 살펴보면, 그 구조를 파악할 수 있게 된다.
태그계의 슈퍼스타
-
<html>
head와 body위에 최상위계층 태그라고 생각하면 된다. -
<head>
본문을 설명하는 정보를 담은 태그다. -
<title>
책으로 치면 표지라고 할 수 있다. 검색엔진이 웹페이지를 분석할 때 가장 중요하게 생각하는 태그다.
<title>What is love?</title>
<meta>
웹페이지가 utf-8 방식으로 저장되어 있다는 뜻이다. 컴퓨터는 최종적으로 0과 1로만 이루어진 정보를 받아들이는데, 0과 1로 저장하는 방식이라고 생각하면 될까?
<meta charset="utf-8">
-
<body>
본문을 나타내는 태그다. -
<!DOCTYPE html>
이 웹페이지가html로 만들어졌다는 관용적인 표현
이라고 생각하면 된다. 문서의 시작에 추가하는 코드다.
12. HTML 태그의 제왕
이 태그는 무엇일까?
- 이 태그 덕분에 웹페이지들을 항해할 수 있다.
- 도시의 길, 인체의 혈관과도 같다.(본드나 실로 비유할 수도 있다)
- HTML에서 Hypertext는 이 태그를 의미한다.
<a href="http://www.naver.com" target="_blank" title="tooltip">네이버로 검색하기</a>
W3C
W3C 멤버들이 모여 미래의 웹의 기술을 결정하고 권고안을 만들면, 그 기준에 따라 브라우저들이 만들어진다.
⚡ 링크를 통해 지식의 바다로 항해하는 것을 공부라고 생각해보라. 책처럼 검증된 정보들이 있는 것은 아니라 분별력이 필요할 테지만, 아주 많은 정보들을 빠르게 흡수하고 실험해볼 수 있다. 내게 꼭 필요한 기술일지도 모른다.
13. 웹사이트 완성
웹사이트
연관된 웹페이지들을 링크라는 본드/실로 결합해서 하나의 책으로 만드는 것이다. 오, 웹사이트는 한 권의 책과 같다!
순서
-
연결될 웹페이지 파일들을 폴더 안에 추가로 만들어주었다. 처음에 만든 웹페이지 파일을 템플릿 삼아서 복제했다.
-
웹페이지들 간에 서로 연결되는 링크를 만들어줬다.
<h2><a href="2.html">CSS 알아보기</a></h2>
- 결과를 확인해보자.
14. 원시 웹
👆 웹은 인터넷을 통해 이용할 수 있는 다양한 서비스 중 하나다.
핵전쟁 이후, 중앙집중적이었던 통신시스템을 분산할 필요를 느꼈고 그것이 인터넷의 시작이었다. 하나가 파괴되도 나머지가 역할을 할 수 있도록 하는 것이다. 인터넷은 1960년에 만들었지만, 소수의 집단이 사용하는 엘리트 시스템이었다. 그러던중 1990년 웹의 탄생이라는 혁명적인 사건이 일어난다. 그 이후로 인터넷은 본격적인 대중화의 길을 걷게 된다.
웹의 탄생
스위스에 위치한 저명한 물리학 연구소인 유럽입자물리연구소에서 비정규직으로 일하는 팀버너스라는 소프트웨어 엔지니어가 있었다. 그는 연구소에서 웹의 전신이 될 프로그램 Enquire
를 작업하고 있었다. 어린시절 읽었던 책인 무엇이든 물어보세요
에서 따온 이름이라고 한다. 그러던 중 1990년, 연구소에 인터넷이 도입되자 자신의 경험과 인터넷을 합성하기 시작한다.
- 1990.10. 웹페이지 편집 프로그램 완성
- 1990.11. 세계 최초 웹 브라우저인 World Wide Web을 만든다
- 1990.12. 웹 서버라는 프로그램을 만들고 프로그램이 설치된 컴퓨터에 주소를 부여한다.
📌 내가 만든 웹페이지를 인터넷을 통해서 전세계의 누구나 볼 수 있도록 해보자!
15. 서버와 클라이언트
인터넷이 동작하기 위해서는 컴퓨터가 몇 대 필요할까? 본질적이고 군더더기 없는 관점에서 2대이다. 2대의 컴퓨터가 서로 정보를 주고 받게 되는 순간, 인류는 다시 태어난다.
팀 버너스는 인터넷으로 연결된 2대의 컴퓨터를 장만한다. 그리고 2개의 프로그램을 개발한다. 바로 웹 브라우저
와 웹 서버
다. 웹 서버가 설치된 컴퓨터에는 info.cern.ch
라는 도메인 이름을 붙이고, 디렉토리에 index.html이라는 파일을 저장한다.
웹브라우저가 설치된 컴퓨터 주소창에 http://info.cern.ch/index.html
이라는 주소를 입력하고 엔터를 친다. 무슨 일이 일어날까? 두 컴퓨터는 전기적 신호를 주고 받게 된다.
👆 요청하는 컴퓨터는 CLIENT
이고 응답하는 컴퓨터는 SERVER
⚡ 공부의 목적은 익숙해지는 것이다, 이해는 익숙함에 도달하기 위한 여러 가지 방법 중 하나이다.
16. 웹 호스팅
직접 웹서버를 운영한다면?
- 언제 접속이 들어올지 모르므로 컴퓨터가 항상 켜져 있어야 한다.
- 웹 서버라는 프로그램을 배워서 깔아야 한다.
- 집 밖에서 웹서버에 연결할 수 있도록 조치를 취해야 한다.
골치아픈 일이다. 이런 일을 대행해주는 회사를 웹 호스팅 업체
라고 한다. 인터넷이 연결된 컴퓨터 한 대 한 대를 호스트라고 이야기한다.
깃허브(GitHub)
- 작성한 코드들을 저장할 수 있는 저장소 역할을 한다. 수정 후 업데이트 시, 변경사항을 확인하는 버전관리도 된다. (변경된 기록을 볼 수 있었다.)
- 웹사이트를 운영할 수 있는 웹서버를 무료로 제공해준다. 우리가 올린 html 파일들로 웹 사이트를 운영할 수 있도록 웹 서버를 제공해준다.
👀 내가 컴퓨터에 웹서버를 설치한 것은 아니지만, 생애 처음으로 웹호스팅 업체를 통해서 누구나 접속 가능한 웹페이지를 만들어보았다!
정적(static) vs 동적(dynamic)
우리의 웹페이지는 HTML만으로 만들어졌고, 웹브라우저가 해석하기 때문에 서버쪽에서 특별히 해 줄 일이 없다
.- HTML만으로 만들어진 웹사이트를 호스팅하는 서비스에는 무료도 많다.
- php나 python, ruby, java와 같은 기술을 이용하려면 대체로 비용을 내야 한다.
🔎 free static web hosting
17. 웹 서버 운영하기
웹 브라우저가 제품명이 아닌 제품군이듯, 웹서버도 마찬가지다. 우리는 여기에서 아파치라는 소프트웨어를 사용할 것이다. 아파치는 오픈소스이고 무료인 공공재다.
미래에는 웹서버를 설치하는 방법이 달라져있을 수 있다. 그 때는 직접 검색하기를 바란다.
🔎 how to install apache http/web server (OS)
⚡ 소프트웨어의 세계는 이렇게 낭만적인 사람들로 가득 차 있다는 말이 마음에 들어온다.
17.1. 웹서버 설치하기
아파치를 윈도우에 직접 설치하는 것이 까다로운 일이라, 대신 설치해주는 프로그램들을 설치했다. bitnami WAMP stack의 도움을 받았다.
- MySQL이라는 데이터베이스의 비밀번호를 설정하는 화면이 있었다.
- 방화벽 설정을 허용해주었다.
- Go to Application을 눌렀을 때, 웹페이지가 정상적으로 뜨면 설치에 성공한 것이다.
- bitnami manager를 통해서 아파치 웹서버를 켜고 끌 수 있다.
17.2. 웹서버와 HTTP
내 컴퓨터에 있는 약속된 디렉토리에 있는 index.html 파일을 요청하는 주소, 즉 규약이다. localhost는 도메인 네임
이고, 번호로 되어 있는 것은 ip 주소
다.
htdocs 디렉토리는 hypertext documents의 약자다. 즉, 웹페이지가 저장된 디렉토리라는 뜻이다. 이 디렉토리에 index 파일을 열어서 수정하고, 리로드하면 웹페이지 내용이 변경되는 걸 볼 수 있다.
htdocs 디렉토리에 있는 파일들을 지우고 내가 작성한 html파일을 복사하고 붙여넣어 보았다. 웹페이지를 리로드했을 때, 나의 웹페이지들이 뜨는 걸 확인할 수 있다.
👆 아이피 주소로 접속하나, 파일열기로 접속하나 웹페이지 내용은 차이가 전혀 없다. 하지만, 내부적으론 전혀 다르게 작동한다.
http
Hyper Text Transfer Protocol = 웹페이지를 전송하기 위해서 만든 통신 규약이라는 뜻이다. 주소가 http://로 시작하면 웹브라우저는 http 통신규약에 따라서 웹서버에 접속하게 된다. file//로 시작하면 웹브라우저는 파일을 직접 열어서 보여준다.
17.3. 웹서버와 웹브라우저의 통신
이제 다른 컴퓨터에 있는 웹페이지를 http를 이용해서 열람해보자.
웹브라우저가 웹서버에 접속하기 위해서는 웹서버가 설치된 컴퓨터의 ip주소를 알아야 한다. 네트워크 속성에서 IPv4라고 되어 있는 주소가 내 컴퓨터의 ip주소다.
- 127.0.0.1
- 나의 아이피 주소
둘 다 내 컴퓨터를 가르킨다. 하지만 전자는 대명사와 같고, 후자는 고유한 값이다.
스마트폰(다른 컴퓨터)으로 http를 이용해 웹페이지에 접속해보자
. 단, 두 컴퓨터가 같은 네트워크에 접속되어 있어야 한다. 처음에 접속이 안 되어 있는데 공용네트워크 방화벽을 해제하니, 연결이 되었다. 이번 수업에서는 도메인 이름을 사용해서 접속하거나 다른 네트워크에 있는 컴퓨터로 웹서버에 접속하는 방법을 다루진 않았다. 그 부분도 궁금하다.
💡 수업을 마치며
<수업을 마치고> 챕터에서 생활코딩의 코멘트가 좋았다.
물론 이 교점은 상상력의 눈으로만 볼 수 있는 점이겠죠. 이렇게 교점을 발견하고 가만히 살펴보니까 교점을 중심으로 앞쪽은 본질을 배우고 뒤쪽은 혁신을 배웁니다. 또 앞쪽은 교양이고, 뒤쪽은 직업이라는 생각이 들었습니다. 교양은 쉽지만 매우 중요한 것을 배우고, 직업은 어렵지만 덜 중요한 것들을 배웁니다.
교양은 조금만 공부해도 할 수 있는 것이 기하급수적으로 많아집니다. 반면에 직업은 아무리 노력해도 실력이 잘 늘지 않습니다. 생각해 보면 우리 마음이 힘든 것은 교양에 있을 때 빠르게 높아지는 능력의 속도를 보지 않고 낮은 능력을 보기 때문이 아닐까요? 또 직업에 있을 때는 높아진 능력을 보지 않고 느려진 속도를 보기 때문이 아닐까요?
What's next?
- 웹사이트를 아름답게 하고 싶다면?
CSS
- 사용자와 상호작용을 하고 싶다면?
JavaScript
- 하나의 파일을 변경하면 1억개의 웹페이지가 바뀌는 폭발적인 경험을?
Php
Jsp
Node.js_익스프레스
파이썬_장고
루비_루비온레일즈
asp_닷넷
등등
⚡ 코딩의 힘 부록편 영상을 보았다. 내 웹사이트에 유튜브 비디오 추가하기, 댓글창/채팅창 추가하기, 방문자 분석기 등을 추가해보는 내용이었다. 단 몇 줄의 코드만으로 (단순해 보이지만) 저런 복잡한 기능들을 내 웹사이트에 무료로 구현할 수 있다는 게 신기했다. 이고잉님은 저 짧은 코드를 만들기 위해 누군가는 10년이 넘게 자신의 돈, 시간, 젊음을 쏟았을 거라고 이야기 해줬다. 나 또한 미래에 누군가에게 유용한 부품이 될 만한 코드를 짤 수 있을까? 혹은 그건 처음부터 특별하게 태어난 누군가의 영역일 뿐일까.
📑 참고자료
Author And Source
이 문제에 관하여(Lecture | HTML & Internet), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://velog.io/@starry3ones/Lecture-HTML-Internet
저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
Author And Source
이 문제에 관하여(Lecture | HTML & Internet), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@starry3ones/Lecture-HTML-Internet저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)