본문 바로가기

분류 전체보기

[HTML] Semantic HTML 이란? Semantic HTML 이란? Semantic HTML이란 직역하면 의미론적 HTML이다. 좀 더 풀어서 얘기를 해보자면, Element마다 의미가 있는 것을 뜻한다. 즉, Semantic elements가 된다. 이것은 브라우저와 개발자 모두에게 알려주는 것인데, Element 이름 자체에 의미가 있는 것이기 때문에, 웹 상에 좀 더 노출이 잘되는 것을 의미한다. 시맨틱 HTML으로 구성하기 전에는, ❮div❯와 ❮span❯으로 HTML을 구성했다. 단, 이 것은 어떠한 의미도 없는 태그다. Semantic HTML으로 구성해야하는 이유? 웹 사이트 개발이 완료되면 그 사이트는 웹 상에 노출되는데, 검색을 했을 때 바로 노출이 되지 않는다. 노출을 하기 위해서는 웹 사이트의 정보가 수집되어야 한다. .. 더보기
[웹 개발] 웹 페이지 크롤링 ( Web page crawling) ※ 이번 포스팅 실습은 Windows Platform으로 진행됩니다. ※ 다양한 카테고리의 웹 사이트 중, 어떠한 특정 사이트 링크들을 모아놓은 사이트 이를테면, 각종 전자기기들의 가격, 가성비, 스펙 등 비교하는 사이트들 많다. 어떻게 한걸까? 바로 웹페이지를 스크랩핑하여 페이지에 노출시킨것이다. 스크래핑이란, 웹 페이지 또는 시스템에 있는 데이터 중에서 필요한 정보를 추출 및 가공하여 제공하는 것이다. 그렇게 데이터를 모으고 모으고 모으다보면 어마어마한 양의 데이터를 어딘가에 적재할 수 있게 된다. 그런 데이터를 빅 데이터(Big Data)라고 하는데, 빅 데이터는 다양한 의미가 있지만 기본적으로 하루 100GB초과하는 대부분의 데이터 스크림이 빅 데이터 범주에 속한다고 한다. 필자는 총 40TB정도.. 더보기
[Javascript] Javascript 기초 Javascript가 뭔가요? Javascript란, 웹 페이지상에서 정적인 부분을 동적으로 변화시켜주는 스크립트 또는 프로그래밍 언어다. HTML이 웹 페이지의 내용 그러니까, 이미지, 제목, 표, 사진과 영상 등을 보여주고, CSS가 구조화된 HTML의 디자인 등의 레이아웃을 지정하면, Javascript는 그들을 동적으로 바꿔주는 역할을 한다. 정적인 웹 페이지는 HTML, CSS만으로도 충분하지만, 좀 더 웹 페이지의 목적과 구조에 맞게 구성하기 위해선 Javascript는 필수이다. 예제를 하나 들어보자면, 누르면 나와 눌러봐! 결과 누르면 나와 눌러봐! 여기에 CSS를 입힌다. CSS 기초에서 했었던 class를 쓰겠다. .click-button { color: #3DAEF8; backgrou.. 더보기
[GIT] GIT 이란? Git이란, '컴퓨터 파일의 변경사항을 추적하고 여러 명의 사용자들 간에 해당 파일들의 작업을 조율하기 위한 분산 버전 관리 시스템'이다. 프로젝트를 하다보면, 하나의 프로젝트에서 여러명이 작업을 한다. 각자가 담당하는 파트를 개발하다보면, 소스를 통합해야할 때가 있다. 이때 소스의 중복과 완성된 프로젝트의 버전관리를 위해 하나의 저장소에서 소스를 관리한다. 기존의 버전관리시스템은 SVN으로 했었다. SVN이란, SubVersion의 줄임말로 형상관리/소스 관리 툴이다. 다시, 하나의 서버에서 소스를 쉽고 유용하게 관리해주기 위한 목적으로 만들어진 소프트웨어다. 여담으로, GIT과 SVN은 버전 관리 방식이 조금 다르다. 먼저, SVN은 하나의 원격 저장소가 있다. 프로젝트는 원격저장소에서 관리되고, 작.. 더보기
[CSS] 마크업 언어 CSS 기초 2020년 말, 대규모 프로젝트를 진행 중에 블로그를 시작해서 그런가 포스팅을 하지도 못하고, 나도 내 자신이 블로그를 시작했단 걸 깜빡했었다. 거두절미하고, 오늘은 Mark up Language의 CSS를 포스팅하려고 한다. CSS란? CSS란, Cascading Style Sheet의 약자로, 작년 8월에 포스팅했던 HTML(ㅋㅋㅋ)에 디자인적 구조를 입혀주는 마크업 언어다. 쉽게 말해, 집의 뼈대가 HTML이라면 집을 예쁘게 꾸미는 것이 CSS다. 웹 개발자는 크게 두 분류로 나뉜다. 프론트엔드(Front-End)와 백엔드(Back-End) 프론트엔드에서도 여러 분류로 또 나뉘는데, 마크업 언어는 보통 퍼블리셔(Publisher)에 해당한다. 하지만, 프론트엔드도 마크업 언어는 알아야하기 때문에 기.. 더보기
[HTML] 마크업 언어 HTML 기초 안녕하세요. developak입니다. 제 소개는 차차 하도록 하고, 첫 게시글인 만큼 웹 개발에 아주아주 기초적인 HTML을 이번에 다뤄볼까 합니다. HTML이란 HTML은 HyperText Mark-up Language의 약자입니다. 웹 페이지의 모습을 기술하기 위한 규약. 프로그래밍 언어가 아닌 마크업 언어라고 하는 언어라고 합니다. 여기까지 설명했던 것은 나무위키에서 가져온 내용입니다. 저도 알고 있는 내용이지만, 좀 더 정확하고 확실하게 알려드리기 위해서 가져왔습니다. 제가 느꼈던 바를 얘기해드리자면, 만약 개발 교육을 듣는다!라고 하면 가장 먼저 만나는 언어이기도 하구요. 이후에 차례차례 각 프로그래밍언어에 대해 설명하겠지만, 이번 시간엔 HTML을 얘기해볼까 합니다. 기본적으로 파일 형식(fo.. 더보기
728x90

티스토리툴바