1) Spring이란? 프레임워크 프레임워크는 반제품이라고 볼 수 있습니다. 애초에 처음부터 제품을 만드는 경우도 있으나 그러기에는 시간과 노력이 너무 많이 소요됩니다. 어느 정도 형태를 갖춘 반제품을 사용하면 그 위에 필요한 기능들만 추가하여 적은 노력과 적은 시간으로 완성된 제품을 만들 수 있습니다. 즉, 중요한 부분, 어려운 부분, 복잡한 부분들은 구현이 되어 있는 반제품을 가지고 필요한 제품을 만들어내면 됩니다. 그런 것을 프레임워크라 합니다. Spring Framework란? 엔터프라이즈급 어플리케이션을 구축할 수 있는 가벼운 솔루션이자, 원-스탑-숍(One-Stop-Shop). 원-스톱-숍은 모든 과정을 한꺼번에 해결하는 상점이라 할 수 있습니다. 원하는 부분만 가져다 사용할 수 있도록 모듈화..
2) Tab UI에 생명 불어넣기 간단하게 이벤트로 해서 Ajax를 가져온 다음에 화면에 넣는 사이클을 해보겠습니다. Ajax를 이용하려면 간단하게 로컬 서버를 띄어주는 게 좋습니다. 만약에 NPM이라는 노드 패키지가 설치되어 있으면 live-server와 같은 것들을 찾아가지고 npm install 할 수가 있고요. 파이썬이 만약에 설치되어 있는 경우도 서버를 띄울 수가 있습니다. 중간에 매번 누를 때마다 데이터를 매번 가져오는 조금 미련한 방법을 하고 있는데 이거는 캐시를 하면 됩니다. 메모리에 보관을 하면 돼요. 메모리에 보관한다는 거는 결과를 배열이나 오브젝트에 넣어놓으시라는 얘기입니다. 있으면 그거를 재사용하는 것이겠죠. type="my-template"가 기술적으로 문제를 일으키지는 않습니다...
1) Tab UI를 만들기 위한 HTML과 CSS 구조전략 Tab UI에는 왼쪽 위에 햄버거 버튼이 있고 그 옆으로 여러 메뉴가 있는 경우가 흔합니다. 그리고 메뉴를 누르면 하단의 내용이 통째로 바뀝니다. 하단의 내용은 텍스트로만 이루어져 있는 경우도 있고 텍스트 이외에 다른 컨텐츠들이 있는 경우도 있습니다. 여기서는 텍스트로 화면만 구성해보겠습니다. 우리가 자주 보는 Tab UI 형태 상단 메뉴를 누를 때마다, 새로 고침 없이 아래 내용이 변경되는 경우가 있을 것 같습니다. 실습코드 TAB UI TEST crong jk pobi honux hello jk Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perferendis consequuntur ..
5) HTML templating 실습 HTML Template의 보관 아래와 같은 html 문자열, template을 어딘가 보관해야 합니다. Javascript코드 안에서 이런 정적인 데이터를 보관하는 건 좋지 않기 때문입니다. var html = "{title}{content}{price}"; Template 보관 방법 서버에서 file로 보관하고 Ajax로 요청해서 받아옵니다. HTML코드 안에 숨겨둔다(?) 간단한 것이라면 HTML 안에 숨겨둘 수가 있습니다. 숨겨야 할 데이터가 많다면 별도 파일(a.template, b.template)로 분리해서 Ajax로 가져오는 방법도 좋습니다. 하지만 여기서는 많지 않은 데이터이므로 우리는 HTML 안에 잘 보관해두겠습니다. Templating HTML..