분류 전체보기 229

CSS 메뉴 바 및 로고 만들기

오늘은 메뉴바를 만들어봤다. 물론 유튜브와 함께 만들고 뜻을 알아가며 혼자 다시 만들고 복습을 했다. 구성은 HTML의 각각 부분들을 만들어주고, CSS파일 안에서 각 부분들을 컨트롤 해줬다. HTML부분을 만드는데 큰 어려움은 없었지만 CSS부분을 짜는데는 어려움이 많았다. 아직도 어떤 명령어를 쓰고, 하나의 명령어에 파생된 부분들은 아직 내게 어렵게 다가왔다. @media 부분을 공부 할 때는 꽤나 만족스러웠다. 단축키 또한 알아가는데 큰 재미가 있었다. media 부분에는 2가지로 나뉘는데 media A B (max로 할지, min으로 구성할지){ 조건 )} 으로 끝이 나는데, A부분은 screen, all, print, speech가 있고 B부분은 and, not, only, ,(comma)가 있..

Frontend 2021.05.03

5.1 CSS 마무리

오늘은 position과 position 상의 overflow프로퍼티를 어떻게 처리해야 되는지, float 프로퍼티, 프로퍼티 상속 순서 등을 공부했다. 이 또한 초점은 내가 웹사이트를 구성 할 때 어떻게 구성하고 그 구성에 따른 코드를 짤 때, 유의해야 되는 부분을 중점으로 공부했다. position 같은 경우에는 아래와 같이 박스를 만들고 그 박스를 위치시킬 때 유의해야 될 부분이 있고, overflow가 나타날 때 처리하는 방법에 대해서도 공부했다. 공부를 하면 할수록 웹페이지를 볼 때 새로운 시각이 나타나고 있다. 상단에는 몇 개의 박스가 들어갔고, 소비자 입장에서 편하게 볼 수 있는 사이트를 구성하기 위해 얼마나 많은 노력과 시간을 들여 코드를 바꾸고 했을까를 떠오르곤 하낟. 그래서 더 공부할수..

Frontend 2021.05.02

2021.04.30 CSS_display_opacity의 놀라

오늘 CSS를 공부하는데 굉장히 흥미롭고 재미있는 기능을 봤다. 잘 안보일 수도 있겠지만 12, 13번줄에 있는 opacity라는 것이다. opacity 프로퍼티는 요소의 투명도를 정의한다. 0.0 ~ 1.0의 값을 입력하며 0.0은 투명, 1.0은 불투명을 의미한다. 그래서 12번째 줄처럼 0.5를 주면 저렇게 반투명하게 나온다. 그리고 15번째 줄에서 hover이라는 명령어를 넣어주면 마우스를 가져다가 되면 12번째 줄 명령어가 반응을 하는데 1초 있다가 서서히 찐해진다. 수 많은 단어들을 하나씩 써가면서 얼마나 알고 있느냐에 따라서 내가 나타낼 수 있는 사이트의 크기와 정교함이 달라 질 것 같았다. 지금 당장 전체적인 것을 다 외울수는 없지만 기능적인 부분과 반복과 복습을 통해 손에 익어가야겠다. ..

Frontend 2021.05.01

2021.04.29 CSS는 HTML을 화장시켜주는 도구다.

오늘 우연히 유튜브를 보는데 친오빠가 친동생이 화장하는 브이로그에 자신의 목소리를 담아 리뷰하는 것을 보았다. 전혀 알지 못하는 화장도구를 전혀 다르게 불러가며 능글맞게 말하며 흉내내는 모습이 사람들의 웃음을 사로잡았다. 그것을 보고 CSS를 공부하는데 CSS가 그 화장품 도구였다. HTML은 도화지의 스케치를 하고, 단어들이 들어갔다면 그 단어들을 CSS를 통해 정확하게 맞춰주고, 예쁘게 꾸며주는 역할을 해줬다. 오늘 CCS를 끝내야지라고 다짐했던 나에게 꺼내보니 그 양이 매우 많았다. 물론 실습적인 부분에 신경을 쓰다보니 다 못 끝냈지만 하나하나 실습해가면서 약간의 수학적인 개념들과 함께 나의 HTML을 꾸며나가는게 신기하면서 생각지도 못한 재미가 있었다. 오늘은 비록 셀렉터 부분을 공부하다가 끝났지..

Frontend 2021.04.30

HTML 동영상 넣기 및 댓글창과 채팅창 집어넣기

오늘 HTML강의를 끝냈다.(끝을 낸 것이지 복습과 반복이 남아있다.) 강의를 들으면서 좀 더 html에 대한 공부가 필요할 것 같아서 부스트코스를 통해 html과 css를 신청했다. html에서 나만 볼 수 있게 채팅창이라던지 동영상 삽입과 댓글창의 구현은 아주 어려운 일이지만 간단하게 표현해서 내 html을 통해 볼 수 있게 한다는 것 자체가 놀라웠다. 아직 화면을 분할하고, 코드가 어렵지만 내가 스스로 바꾸고 싶은 문구와 바꾸고 싶은 창들을 내가 컨트롤 할 수 있다는 것에 놀라움을 느끼며 오늘 하루를 끝을 내려한다. 아래와 같은 기능들은 생활코딩에서 자세히 잘 설명해주지만 동영상 같은 경우에는 공유 버튼 -> 퍼가기를 누르면 으로 시작하는 부분을 복붙하면 되는데 폭과 길이를 조절할 수 있다. 그 부..

Frontend 2021.04.29

Codeup 1045문제

정수 두 개를 받아 자동계산하기 #include int main(void) { int a; int b; scanf("%d %d", &a, &b); printf("%d\n", a+b); printf("%d\n", a-b); printf("%d\n", a*b); printf("%d\n", a/b); printf("%d\n", a%b); printf("%.2lf\n", (float)a/b); } 1) 실패이유 : 처음 개행을 안 넣어줘서 합이 한 번에 나왔다. 2) 맨 마지막은 실수형으로 소수점 세 번째에서 반올림을 해줘야하는데, %.2lf 대신 d를 넣었고, 뒤에 (float)을 추가 하지 않았다. 하나씩 나타낼 때는 쉽지만 여러개의 사칙연산을 해줄 때 개행을 넣어줘서 각각 표현함과 실수형을 나타나게 하려면..

알고리즘문제 2021.04.28

4.27 생활코딩 HTML

어제의 이어 생활코딩 HTML로 공부를 이어갔다. 어제 이해가 되지 않았던 부분들을 한 번더 보고 복습을 통해서 웹에서 내가 꾸며내는 화면들을 집어내면서 작성할 수 있었다. 특히 어트리뷰티에 대한 이해가 잘 되지 않았는데 접근성을 예로 들어서 설명해주셔서 이해가 잘됐다. 기초 문법과 문서의 구조화 그리고 하이퍼링크를 이용한 웹 사이트의 이동경로들도 되게 신기했다. 보면 HTML, CSS, JS에 하이퍼링크를 각각 걸었다. 그리고 그에 대한 파일도 1.html, 2.html, 3.html도 각각 만들어 파일 각각에 내용을 써넣었다. 그리고 실행 시키고 링크를 따라가면 적어놓은 텍스트가 똭!! 하고 나왔다. 그 때 느껴지는 희열은 대단히도 굉장했다. 내일이면 HTML의 수업이 끝이 나고 복습을 한 차례 진행..

Frontend 2021.04.27

HTML 첫 발걸음

HTML이란 용어를 처음 봤을 때 뭔가 HTTP가 떠올라서 비슷한 용어라고 생각됐다. 뚜껑을 열어보니 신기했다. 내가 로그인했던 웹들의 페이지들의 한 부분을 내가 만들고 있었다! 참 신기하고 충격적이였다. 기사의 한 페이지를 내가 작성해가는 편집가가 되어서 나만의 이야기를 편집할 수 있었다. 생년월일이 뜨게하는 로직들, 체크하는 박스들, 알 수 없는 이야기들의 형언.. 오늘 1-10과를 나가기로 마음을 먹고 오늘 하루를 잘 끝냈다. 내일은 생활코딩 HTML편을 보고 오늘 했던 부분들을 다시 복습해가는 과정을 거친다. 내일이면 다 까먹겠지만 다시 복습해가며 다시 생각을 해 나간다. 오늘 참 재밌었다.

Frontend 2021.04.27

2021.04.25

어느 덧 42seoul 4기가 끝나고 1주일하고 이 틀이 지났다. 금요일 탈락소식과 동시에 국비학원과 코딩부트캠프를 알아보고 있다. 둘 다 약 6개월의 시간이지만 무료교육과 약 천만원의 교육을 택해야 한다. 하지만 결국 둘 다 내가 성장할 수 있는 곳이고, 돈의 차이일 뿐이다. 그렇다면 둘 다 준비해서 둘 다 되기를 기대하며 오늘부터 코딩일기를 써보려고 한다. 내가 지원할 빝국비학원과 사설코딩부트캠프는 7월에 열릴 예정이다. 그 때 까지 발품 팔아 잘 알아보고 매일 나의 코드이야기를 적고 먼 미래 이 오글거리는 글과 나의 상태가 어떨지 비교해가며 함박웃음 지을 날이 오기를 고대해본다. 거북이는 느리지만 꾸준히 갈 길을 간다.

카테고리 없음 2021.04.25
반응형