TIL #2

박감자·2024년 9월 11일

TIL

목록 보기
2/34
post-thumbnail

시작하기 전에...

어제부터 웹개발 종합반 강의를 듣기 시작했다. 1-2주 강의 내용은 사실 기초 강의의 연장선 같은 느낌으로 좀 더 세세하게 복습하는 느낌이었다. 그리고 기초반과는 다르게 만든 페이지들이 CSS 내용을 더 다루고 있었다. 오늘도 딱히 한 과제는 없지만 2주치 강의를 간신히 따라잡았다는데 의미를 두려한다.

프론트엔드 웹개발 종합반 1주-2주차 강의 요약

부트스트랩(Bootstrap)

모든 코딩이 대개 그렇지만 복붙은 기본이자 일상이다. HTML/CSS의 기본적인 요소들을 정리해준 Bootstrap을 통해 웹페이지 꾸미기를 빠르게 완성시킬 수 있다.

버튼, 카드, 입력창, 헤더 등 다양한 디자인을 참고하고 코드도 가져와서 어제 만들었던 로그인 페이지를 좀 더 꾸며보고 영화평가 웹페이지도 만들어보았다. 중요하다고 생각한 포인트들은 개발자 도구의 활용과 코드 정리이다.

  1. 개발자 도구 활용
    우선 저번 주차 강의에서 들었을때는 console의 활용도가 높았는데, 이번 1-2주차 강의에서는 검사와 개발자 도구를 통해 필요한 components를 찾는 방법과 웹페이지 내에서 변화를 바로 적용하는 방법이 조금 새로웠다. 잘 활용하지 않던 도구들이라 조금 생소했지만 알고는 있던 터라 금방 '저렇게 활용이 가능하군'하면서 열심히 강의를 통해 복습하였다.

  2. 코드 정리
    졸업과제 할때도 느꼈던 거지만, 페이지 하나당 들어가는 components 수와 기능적인 부분까지 더해지면 코드가 얼마나 길어지를 잘 알고 있다. 그때는 단순히 과제였던 탓에 정리하는 습관까지 들이지는 못했는데, 이번에 이를 활용할 수 있을 것 같다.

    일단 id를 통해 특정 요소를 지정/불러오기 등을 더 이용할 수 있겠다는 생각이 들었고, 단축키인 Alt+Shift+f는 이번에 강의를 통해 처음 배웠다. 이런 정리를 통해 팀원과 코드를 공유할때 조금 더 알아보기 용이하게 바꿀 수 있을 것이다.

JQuery

JQuery는 하나의 라이브러리로써 JS 작성이 쉽도록 도와준다. JS로 기능은 같지만 보기가 복잡한 코드를 좀 더 알아보기 쉽게 해주며 문법은 JS 라이브러리이기 때문에 JS와 똑같다. 다만 아직 이번 주차까지는 자세히 다룬 느낌은 없고 3주차 강의 들으면서 더 활용 할 듯 싶다.

마치며...

이번에 들었던 강의 내용들이 기초 강의보다는 훨씬 많았지만 복습의 느낌으로 다가왔기 때문에 새롭게 알게된 사실만 정리해보았다.

전공자이긴 하지만 JS를 학교에서 배운적이 없기 때문에 오로지 과제를 위해 급하게 독학을 했었는데 이렇게 많은 도구의 활용법을 놓치고 있었구나 싶은 강의였다.

profile
코딩하는 감자

0개의 댓글