미리보기 start.spring.io를 통해 간편하게 스프링 부트를 시작 할 수 있음. 스프링 부트 3.0 이상 부터는 Java 17 필요. static/index.html 을 올려두면 Welcome page 기능을 제공한다. Controller을 통해 스프링 부트 제어가능. 이후 getMapping(url)을 통해 특정 url 감지 return...
리엑트란? 리엑트를 사용하는 이유는 Single Page Application(SPA)때문이라고 합니다. 간단하게 이야기하면 오직 하나의 HTML을 사용한다는 겁니다. 그렇기에 페이지에 변화가 생긴다면 단순히 해당 부분에 대한 변경을 통해 별도의 새로고침 없이 페이지의 내용을 변경해줍니다. 또한, JSX라는 문법을 통해서 쉽고 간편하게 html을...
Typescript 01
Typescript 자바스크립트에서는 5 - ‘3’과 같은 연산이 가능합니다. JS에서 간편하게 알맞은 타입으로 변환시켜주기에, 엄격하게 타입을 설정하지 않고 사용이 가능합니다. 다만, 이런 방식은 JS조차 무슨 이유로 에러가 발생하였는지 확실하게 알지 못하기에 프로젝트가 커질 수록 장점이 아닌, 단점으로 적용합니다. 그렇기에 타입스크립트에서는 ...
JavaScript 입문 2
querySelectorAll() 기존 querySelector을 이용해 하나의 요소를 가져올 수 있었습니다. 그렇다면, query에 선택되는 요소들을 모두 가져오려는 경우는 어떻게 할까요? 네 맞습니다. querySelectorAll을 이용해 가져오면 되겠죠. 다만 querySelectorAll을 배우기 전에 먼저 querySelector을 이...
JavaScript 입문 1
많은 사람들이 FrontEnd의 기초는 HTML,CSS 그리고 JavaScript를 이야기합니다. 해당 포스팅에서는 HTML과 CSS를 어느정도 배운 사람이 JavaScript에 대해 입문하려는 경우 도움이 될 내용을 작성했습니다. JavaScript란? 간단하게 JavaScript는 HTML과 CSS에 행동을 부여해주는 역할을 합니다. HTML을...
HTML/CSS 고급 모듈
이전 HTML/CSS에서는 HTML과 CSS에 대한 기본적인 이해와 응용에 관한 내용이었다면, 이제는 어떻게 하면 좀 더 쉽게 레이아웃을 작성 할 수 있는지에 대해서 적어볼까 합니다. Bootstrap FrontEnd에서는 Bootstrap이라는 툴킷을 이용하여 좀 더 쉽고 빠르게 프로젝트를 완성 시킬 수 있습니다. 먼저, Bootstrap을 시...
기본 CSS속성 2
Flex 속성 기본적으로 div 박스는 아래로 정렬되는 속성을 가지고 있습니다. 즉, 위에서 부터 아래로 한칸씩 쌓이는 것이죠. 그렇지만, flexbox를 이용하면 이를 손쉽게 변경 할 수 있습니다. <div class="flex-container"> <div class="box"></div> <div ...
기본 CSS속성 1
다양한 레이아웃 속성들 웹 페이지 레이아웃을 만들 때 가장 먼저 해야 하는 것은 세분화 입니다. 하나의 페이지를 여러 구역으로 나누고, 해당 구역을 다시 박스 형태로 나누다 보면 어떤 식으로 코드를 작성해야 되는지 감이 잡힐 것이라고 생각 됩니다. float 속성 <div class="container"> <div clas...
기초 HTLM,CSS 문법.
HTML이란? 하이퍼 텍스트 마크업 언어(Hyper Text Markup Language, HTML) 짧게 설명하자면, <태그> 형식을 이용하여 제목, 단락, 목록 등 구조적 문서를 만들 수 있는 방법을 제공하는 마크업 언어입니다. 아래는 HTML의 기본적인 템플릿 입니다. <!DOCTYPE html> <html>...
Vue.js 3.x 입문 - 01
글을 시작하며, 해당 포스팅은 아래의 강의를 참고하였습니다. 4시간만에 완벽하게 끝내는 Vue.js 입문 & Vue.js 3.x 최신버전 Vue 시작하기 Vue 설치 VsCode 상단 툴바에서 터미널을 실행시켜줍니다. 만약, VsCode가 설치되어 있지 않는다면 해당 링크를 통해서 홈페이지로 이동하여 설치 할 수...
Recently Updated