1일차
오늘 챌린지는 3일간 간단한 프로그램을 만들어야 하는 미션이 주어졌다. 어떤 프로그램을 만들까 고민하다가 간단하게 나만의 웹사이트를 만들어보면 어떨까라는 생각이 들었다. 실습은 유튜브 채널 생활코딩님의 영상으로 진행하고 있어서 참고해서 만들어보면 좋을 것 같았다. 웹에 대해서 얕게 알고 있는 상태이지만, 알고 있는 내용을 최대한 뽑아내서 만들어보아야겠다. 모르면 구글링하면 되지 뭐
<!doctype html>
<html>
<head>
<title>Welcome!</title>
<meta charset="utf-8">
</head>
<body>
<h1></h1>
<h2></h2>
</body>
</html>가장 기본적인 뼈대이다. 너무나도 앙상하다. 내용을 하나씩 추가하면서 만들어나가야겠다. 처음은 인사를 한 줄 넣어주었다. 그리고 다른 페이지로 구경하다가 돌아올 수 있도록 a태그를 달아주었다.
음. 뭔가 느낌이 좋다. 해치웠나? 뭐 이런거 그 다음에는 블로그, Github, 인스타그램 주소들을 링크를 달아서 작성했다. 그리고 글만 있으면 너무 심심하니 사진 한 장을 넣어주었다.
흰 도화지에 그림을 그리는 기분이다. 신난다. 사진 밑에는 나를 소개하는 소개글을 적어주었다. 소개글이 오글거리기는 하지만, 중2병 감성충이다 그래도 마지막 줄은 요즘 내가 많이 드는 생각이다. 공부하면서 내가 왜 프로그래밍을 시작하게 되었는지 흐릿해지는 것 같아 한번 적어보았다. 다른 html파일을 만들어 내 전공, 2022년 목표, 지금 진행하고 있는 챌린지에 대해서 적어보았다. 생각보다 적을게 없었다.흑흑 올해는 열심히 살아보아야지
Major 전공을 클릭하면 다음과 같이 출력된다.
2022년 목표를 클릭하면 다음과 같이 출력된다. 2022년이 된 지 보름이나 지났는데 아직 확실한 목표가 없다..사실 지금 당장은 이 챌린지를 완주하는 것이 단기적인 목표이다. 올해는 코린이 탈출하고 싶다
22 Basic Chllenge를 클릭하면 다음과 같이 출력된다. 오늘까지 해서 절반이나 했다니 생각보다 시간이 빠르게 지나가는 것 같다.
오늘은 이 정도로 마무리 하려고 했는데 링크로 접속했을 때, 아래 바와 색깔이 파랗게 변하는 것이 개인적으로 신경이 쓰였다. 구글링을 해서 클릭해도 색이 변하지 않고 아래 줄 생성이 안되도록 만들어주었다. 아래 코드를 활용했다.
<HEAD>
<style type="text/css">
/* link - 아직 클릭하지 않은 경우 */
a:link { color: black; text-decoration: none;}
/* visited - 한번 클릭하거나 전에 클릭한적 있을 경우 */
a:visited { color: black; text-decoration: none;}
/* hover - 마우스를 해당 링크에 위치했을 경우 */
a:hover { color: black; text-decoration: underline;}
</style>
</HEAD>
그러면 위 그림과 같이 아래 줄이 없어지고, 클릭 시에도 색도 검정색으로 일정하게 된 것을 확인할 수 있었다. 웹 서버 구동은 DAY2의 코드를 활용했다.
정리 및 느낀 점
오늘은 html파일로 홈페이지를 만들어보았다. 내가 코드를 짜고 그것이 시각적으로 바로 출력된다는 점에서 흥미를 느꼈다. 내일은 어떤 것을 해볼까에 대한 기대도 생겼다. 매우 간단한 홈페이지이지만 꽤나 큰 한 걸음이었다. 완성이 되면 github에 올려볼까 생각 중이다. 만들면서 팀에 왜 디자이너분들이 있어야 하는지도 실감하게 되었다😂. 차근차근 할 수 있는 것부터 열심히 해나가자.
