728x90
반응형

전체 글 38

[HTML] 05. Hyperlink

🟡 1. hyperlink - hyperlink는 html link라고도 불리고, hyperlink를 눌렀을 시 작성자가 설명하고자 하는 내용이 있는 웹주소로 이동하게 됩니다. 태그로는 a 태그를 사용하고 있습니다. 네이버 홈페이지 고고 네이버 홈페이지 고고 🟡 1.1 href 속성(attribute) - href 속성은 이동하고자 하는 정보나 파일의 위치(경로)를 지정해줍니다. 경로는 웹사이트의 주소 일 수도 있고, 내 컴퓨터 안에 파일 경로 일 수도 있습니다. 🟡 1.1.1 디렉토리(Directory) - 디렉토리는 컴퓨팅에서 파일을 분류하기 위해 사용하는 이름 공간이라고 위키백과에서는 설명하고 있는데, 쉽게 말해서 폴더라고 생각하면 됩니다. 조금 TMI를 하자면 MS-DOS, UNIX와 같은 CLI..

Front-End/HTML 2021.11.15

[HTML] 04. 텍스트 관련 태그2

🟡 1. p 태그 - p 태그는 단락을 지정할 때 사용합니다. 첫번째 단락입니다! 두번째 단락입니다!!!!! 🟡 2. br 태그 - br 태그는 줄 바꿈을 해주는 태그입니다. 어려운 말로는 개행(line break)을 지정한다고 하는데, 결국 줄 바꿈을 뜻하는 말입니다. 그리고 br 태그는 빈 요소이므로 종료 태그가 없습니다. 첫번째 단락입니다! 두번째 단락입니다!!!!! - br 태그는 개수만큼 줄 바꿈이 진행이 됩니다. br 태그 1개 br 태그 4개 첫번째 단락입니다!두번째 단락입니다!!!!! 첫번째 단락입니다!두번째 단락입니다!!!!! 🟡 3. p 태그와 br 태그의 차이점 - '그럼 p 태그와 br 태그 둘 다 줄 바꿈을 하는데, 차이점은 모지?'라는 생각이 들 것입니다. 쉽게 차이를 보기 위해..

Front-End/HTML 2021.11.12

[HTML] 03. 텍스트 관련 태그

🟡 1. 제목 (headings) 태그 - heading 태그는 h1 ~ h6까지 있으며, 제목을 나타낼 때 사용합니다. h1이 제일 크기가 크고 중요도가 높으며 숫자가 작아질수록 크기도 작아집니다. 검색엔진에서는 heading 태그를 통해서 제목이라고 인식하는 경우가 많으므로, 제목 이외에 사용은 하지 않는 것이 좋습니다. h1 태그 h2 태그 h3 태그 h4 태그 h5 태그 h6 태그 🟡 2. 폰트 (text Formatting) 태그 🟡 2.1 b 태그 - b태그는 bold의 약자로 글자를 bold 처리합니다. 보통 글씨체 볼드 글씨체 🟡 2.2 strong 태그 - b태그처럼 글자를 bold 처리해준다. b태그와 다른 점은 b태그는 단순 텍스트를 진하게 표시하는 것이지만, strong태그는 실제로..

Front-End/HTML 2021.11.10

[프로그래머스] lv01. 로또의 최고 순위와 최저 순위(자바스크립트)

문제 로또 6/45(이하 '로또'로 표기)는 1부터 45까지의 숫자 중 6개를 찍어서 맞히는 대표적인 복권입니다. 아래는 로또의 순위를 정하는 방식입니다. ◾ 순위 당첨 내용 1 6개 번호가 모두 일치 2 5개 번호가 일치 3 4개 번호가 일치 4 3개 번호가 일치 5 2개 번호가 일치 6 (낙첨) 그 외 로또를 구매한 민우는 당첨 번호 발표일을 학수고대하고 있었습니다. 하지만, 민우의 동생이 로또에 낙서를 하여, 일부 번호를 알아볼 수 없게 되었습니다. 당첨 번호 발표 후, 민우는 자신이 구매했던 로또로 당첨이 가능했던 최고 순위와 최저 순위를 알아보고 싶어 졌습니다. 알아볼 수 없는 번호를 0으로 표기하기로 하고, 민우가 구매한 로또 번호 6개가 44, 1, 0, 0, 31 25라고 가정해보겠습니다...

[HTML] 02. 기본 Tag

🟡 1. DOCTYPE html - DOCTYPE html이란 웹문서가 어떤 버전의 html 언어로 작성되었지를 표시하는 기능을 하는 태그입니다. 이를 문서 형식 정의(Document Type Definition, DTD) 태그라고 하는데, html문서 최상단에 위치해야 합니다. 그럼 웹브라우저는 DTD를 통해서 맞는 버전에 맞게 페이지를 로드해줍니다. HTML5 HTML 4.01 HTML 1.0 🟡 2. html tag 화면에 실제로 보이는 구간 - html태그는 모든 HTML요소들의 부모 요소이자 웹페이지의 제일 큰 테두리입니다. 그리고 웹페이지에서 단 한 번만 기술되면 됩니다. 🟡 3. head tag - head 태그 안에는 많은 메타데이터(다른 데이터를 설명하는 데이터)들을 포함할 수 있고, 그..

Front-End/HTML 2021.11.08

[HTML] 01. HTML란? 그리고 기분 문법

🟡 1. HTML이 먼데? HTML이란 (HyperText Markup Language)의 약자로서 웹페이지의 내용과 구조를 표현하는 마크업 언어입니다. 이게 먼소리야 😧 개발을 시작한 지 근 7년 정도(학교 포함..) 됐는데, 도큐먼트나 MDN에서 설명해주는 말은 무슨 말인지 도통 모르겠다... 내가 생각하는 HTML은 쉽게 생각해서 건물의 뼈대라고 생각한다. 사진과 같이 아파트나 건물을 짓기 위해서는 뼈대(철골)를 먼저 세워서 틀을 만들어준다. HTML도 마찬가지로 웹페이지를 제작하는 과정에서 뼈대이자 틀을 만들어주는 언어이다. 그럼 마크업언어가 뭐지? 마크업 언어란, 태그 등을 이용하여 문서나 데이터의 구조를 표기하는 언어이다. 이러한 모양을 태그라고 한다. 그리고 태그는 항상 시작태그(start ..

Front-End/HTML 2021.10.31

Front End Roadmap(프론트엔드 개발자 로드맵)

안녕하세요! 이번 글은 Front End 개발자가 되기 위해서 어떠한 순서로 공부를 해야 되는지 알아보려고 합니다! 아래에 나와있는 사진은 https://roadmap.sh/frontend 에서 제공해주는 로드맵입니다. 물론 아래에 나와있는 내용을 전부다 공부를 하고 마스터를 해야 프론트 엔드 개발자가 될 수 있다!는 아닙니다. 다만 이러한 흐름을 알고 아래와 같은 순서로 공부를 한다면 더욱 원활하게 공부가 되고, 서로 다른 언어들의 상관관계를 쉽게 파악할 수 있을 겁니다. 1. Internet - 프론트 엔드 개발자는 결국 웹 환경에서 개발하는 개발자이므로, Internet이 어떠한 환경이고 어떤 식으로 HTML, CSS, Js 파일들을 실행시키고, 어떠한 순서를 갖고 등의 배경지식을 알아야 합니다. ..

Front-End 2021.10.21

개발 관련 글을 작성하기 전에 말씀드리고 싶은 말.

안녕하세요! 제가 블로그는 처음이라 많이 서툴고, 글도 잘 못 써서 무슨 말을 쓴거야? 하실수도 있습니다... 그점 감안해서 봐주시면 감사하겠습니다 :) 저의 개발경력은 그렇게 길지 못합니다. 첫 직장인 웹에이전시 회사에서 8개월 정도 풀스택아닌 풀스택으로 근무를 했고(Java, js) EPR회사에서도 풀스택아닌 풀스택으로 ㅋㅋㅋ 일을 했습니다. (C#, js) 짧지만 회사에서 일을 하면서 저의 성향이 Front End쪽에 가깝다는 것을 느꼈습니다. 그래서 JS등 Front End를 초심으로 돌아가서 공부를 하면서 블로그 글을 작성할 예정입니다. 줄여서 말하면... Front End 위주의 글을 많이 작성할 예정입니다.. ㅋㅋㅋ 감사합니다!

Front-End 2021.10.20