반응형 프로그래밍/프론트엔드 방랑기3 [ Vanilla JS] 자바스크립트만으로 To do List 만들기 우선 바닐라 자바스크립트란 자바스크립트 라이브러리 등을 사용하지 않고, 순수하게 자바스크립트 언어로만 프로그래밍을 하는 것이다. 워낙 제이쿼리같은 문법 라이브러리를 많이 사용하는해온 터라, 사실 처음에는 긴가민가하면서 문법을 사용하다가 차츰 익숙해지기 시작했다. 바닐라 자바스크립트를 사용하는 까닭은 속도가 빠르기 때문이라고 한다. 근데 Thymeleaf template layout은 자바스크립트와는 관련 없는 스프링부트 템플릿 엔진이니까 바닐라라고 할 수 있겠지..? 테이블 형태로 만들었고, 그래서 약간 애를 먹었다 TT - 가벼운 TodoList - + 소요 시간 : 약 6시간 + 특징 1. ul-li가 아니라 table 요소를 이용한 TodoList (웹표준에 따르면 table 요소는 간단한 페이지처.. 2021. 1. 16. [Thymeleaf] Thymeleaf template layout으로 초기 세팅하기2 JSP에서 include를 써보았다면 같은 맥락으로 이해하면 좋은 라이브러리, thymeleaf template layout를 통해 편리하게 구역을 나눌 수 있다. 이 템플릿엔진을 통해 구역을 나눠주면 화면을 관리하기에 훨씬 편해서 사용해보기로 했다. 1. 디렉토리 구성과 전체 구상도 전체 디렉토리 구조 : 이런식으로 폴더를 추가해주는데 자신의 용도에 따라 레이아웃을 구분하고 구현 할 수 있으며 쓰는 용도에 따라 nav 등을 추가할 수 있다. 전체 구상도 : 이렇게 세가지 구역으로 나눌 것이고, header와 footer는 고정하고, content영역만 바꿔낄 수 있게 해줄 예정이다. 2. 디펜던시 추가 nz.net.ultraq.thymeleaf thymeleaf-layout-dialect 2. 전체 코.. 2021. 1. 11. [Spring boot+css+html(Thymeleaf)+Js] 초기 세팅하기1 단독 프론트엔드 프로젝트를 하기 위한 설렘이 시작됐다. 아는 내용이었지만 한 번 더 정리하고자 하는 마음으로 이렇게 글로 정리하도록 한다. 참고로 jsp가 아닌 Thymeleaf를 쓰는 이유는, 그동안 개인플젝에서는 jsp만 써봐서 다른 방식을 써보기 위한 것도 있고 레이아웃을 구성할때 훨씬 명시적이고 쉽기 때문이다. 1. Javascript를 작성하기 위한 프로그램 프론트엔드 프로그램이 무엇이고, 뭘 써야 하는지 궁금해 했었다. 나는 항상 스프링, 스프링부트로 만들었기때문에 그런게 사실 따로 있나? 하기도 했다. 강의나 이것 저것 찾고 질문해보니 Sublime Text를 써도 되고, VS Code를 써도 되는 것 같다. 만약 프론트엔드 프로젝트나 프론트엔드만으로 이뤄진 프로그램을 작성할 거라면 굳이 S.. 2021. 1. 10. 이전 1 다음 반응형
