본문 바로가기

분류 전체보기322

Vue.js의 기본문법 Vue.js의 기본문법을 알아보겠다. Vue.js는 템플릿 문법, 디렉티브, 이벤트 처리 등 다양한 문법을 제공하는데 아직 배운지 얼마 되지도 않았고 어제 사용했던 문법만 간단하게 정리해보겠다. 1. 보간법(Interpolation) 처음 사용했을 때 굉장히 신선했던 부분이였다. 중괄호( {{ ???? }} )를 사용하여 데이터를 템플릿에 보간할 수 있다. {{ message }} var app = new Vue({ el: '#app', data: { message: '안녕하세요!' } }); 위의 예제에서 {{ message }}는 Vue인스턴스의 "message"데이터를 보간하여 화면에 표시한다. 2. 디렉티브(Directives) v-접두사를 가진 특수 속성으로, DOM요소에 특정 동작을 바인딩 할.. 2023. 6. 15.
Vue.js Vue.js는 사용자 인터페이스를 만들기 위한 프로그레시브 프레임워크이다. 다른 단일형 프레임워크와 달리 Vue는 점진적으로 채택할 수 있도록 설계가 되었다. 핵심 라이브러리는 뷰 레이어만 초점을 맞추어 다른 라이브러리나 기존 프로젝트와의 통합이 매우 쉽다. 그리고 Vue는 현대적 도구 및 지원하는 라이브러리와 함께 사용한다면 정교한 단일 페이지 응용프로그램을 완벽하게 지원할 수 있다. 즉 프론트 엔드 웹 애플리케이션 개발을 위한 JavaScript 프레임 워크로서, 사용자 인터페이스를 구축하기 위한 도구와 패턴을 제공하는 녀석이라 생각하면 좋을 것 같다. Vue는 AngularJS를 사용하여 구글을 위해 작업하던 Evan You에 의해 개발이 되었는데, Angular에 대한 장점만을 가지고 가볍게 만들.. 2023. 6. 15.
Vue.js 처음 사용해본 후기 2023년 6월 14일날짜로 어느덧 jsp와 서블릿을 마무리하고 학원에서 Vue.js를 처음으로 배워보았다. 완전 기본기만 배워보았을때에는 딱 드는 생각이 "와 이거 진짜 편하다"라는 생각이 들었다. 평상시에 JavsScript를 워낙이 힘들어하는 성격이기도하고 많이 어려운 언어라 생각된다. 강사님께 Vue.js랑 리액트랑 많이 다른가요?라고 질문했을 때 그냥 만든사람만 달라요~라고 대답해 주셔서 아직까지 둘의 차이도 잘 모르겠고,(리액트는 아직배우지모 못함) 아직까지는 굉장히 간편하다?그리고 간결하다 라는 느낌밖에 들지 못했다. 제발 Vue.js랑 리액트를 통해서 좀 JavaScript랑 친해졌으면 좋겠다.. 2023. 6. 15.
20230614 수업내용🧏‍♂️ 오늘도 첫 수업시작은 js로 오늘은 popover에 대해서 bootstrap을 통해 배우고 있다. 님 어서오고! 로그아웃 인덱스 페이지 입니다. 회원가입 로그인 놀러가기(로그인필요) 공부하기(로그인필요) 자료실 form 테스트 글 목록보기 여태 만들었던 index.jsp 페이지 이다 이제 이 코드를 어제 배운 el을 적용시켜서 바꿔보겠다. 오늘로 jsp를 마무리하고 vue.js수업으로 넘어간다 https://v2.ko.vuejs.org/v2/guide 시작하기 — Vue.js Vue.js - 프로그레시브 자바스크립트 프레임워크 v2.ko.vuejs.org 새로운 html파일을 만들어주고 Vue.js에서 script src를 복사해 붙여넣어주었다. 위에 링크를 통해 Vue라는 객체를 생성하면서 object.. 2023. 6. 14.
객체지향 설계 원칙 SOLID 객체지향 설계 원칙인 SOLID SOLID는 소프트웨어 개발에서 유지보수 가능하고 확장 가능한 시스템을 만들기 위한 가이드 라인이다. 이 SOLID는 다섯 가지 원칙으로 구성되어 있으며, 각각 다음과 같이 표현된다. SRP(Single Responsibility Principle) 단일 책임 원칙 클래스는 단 하나의 책임만을 가져야 한다. 즉, 클래스는 변경의 이유가 하나여야 하며, 변경될 수 있는 이유도 단 하나여야 한다. 이를 통해 클래스의 응집도를 높이고 결합도를 낮출 수 있다. OCP(Open-Closed Principle) 개방-폐쇄 원칙 확장에는 열려있고 수정에는 닫혀있어야 한다. 이말은 즉, 기존의 코드를 수정하지 않고도 기능을 추가할 수 있어야 한다. 이를 위해 인터페이스와 추상화를 활용하.. 2023. 6. 14.
JAVA try-cath-finally 🧏‍♂️try-with-resources Java 의 try-catch-finally는 수업시간에 DAO를 만들 때 많이 사용했었는데 구글링을 하다가 배우지 않았던 try-with-resources라는 것을 발견했다. 조금더 간편해졌다는 글에 귀가 솔깃솔깃 해졌는데 한번 찾아보고 정리해 보았다. 우선 두개 다 Java에서 예외 처리를 위해 사용되는 구문인데 각각의 특징을 먼저 살펴보자면 try - catch - finally try - catch - finally 구문은 예외 처리를 위한 전통적인 방식이며, try블록 내에서 예외가 발생할 수 있는 코드를 작성하고, catch블록에서 해당 예외를 처리한다. finally 블록은 예외 발생 여부와 관계없이 항상 실행되는 코드 블록이다. try - catch - finally의 장점으로는 예외 처리.. 2023. 6. 14.
Spirng Framework 와 Spring Boot의 차이 기존에 개발에 몸담고 계시는 선배님들이 보면 이게 뭔 어그로야?하실 수 있긴한 글이지만 웹 프로그래밍의 ㅇ 도 몰랐던 때가 떠올라서 한번 적어본다. Spring Framwork와 Spring Boot는 모두 Java 기반의 웹 애플리케이션 개발을 위한 프레임워크이다. 하지만 이둘은 각가의 목적과 특징이 다르다. Spring Framwork는 많은 기능과 모듈을 제공하는 포괄적인 엔터프라이즈 애플리케이션 개발을 위한 프레임워크이다. 주요 목적은 개발자가 애플리케이션의 다양한 측면을 관리하고 제어하는 데 도움을 주는 것이다. Spring Framwork는 제어 역전(Inversion of Control,IoC)과 의존성 주입(Dependency Injection, DI)등의 개념을 기반으로 한다. 이를 통해.. 2023. 6. 14.
Cookie와 Session의 차이 오늘 강의중 cookie(이하 쿠키)에 대해서 배우다가 session(이하 세션)이랑 무엇이 다른지 궁금해서 찾아보고 정리해보았다. 우선 두개다 웹 애플리케이션에서 사용자의 상태를 유지하고 추적하는데 사용되는 매커니즘인건 맞는거 같지만 쿠키와 세션은 몇 가지 중요한 차이점이 있는거 같아 정리해 보았다. 저장 위치 쿠키는 클라이언트(사용자의 웹 브라우저)에 저장되고, 세션은 서버에 저장된다. 데이터 보관 방식 쿠키는 클라이언트 측에 작은 텍스트 파일로 저장된다. 이 파일에는 이름, 값, 만료 날짜 및 경로 정보 등이 포함된다., 세션은 서버 축에 저장되며, 일반적으로 서버의 메모리나 데이터베이스에 상태 정보를 저장한다. 보안성 쿠키는 클라이언트에 저장되기 때문에 클라이언트에서 쿠키의 내용을 볼 수 있다. .. 2023. 6. 13.
20230613 수업내용🫡🫡🫡 첫 수업은 js에대해서 배운다 오늘은 modal에 대해 배운다. Modal 테스트 Modal 띄우기 눌러보셈 알림 확인 버튼을 누르면 삭제 됩니다. 확인 취소 알림2 확인 버튼을 누르면 저장 됩니다. 확인 취소 이제 이클립스를 실행하고 어제 배우고 있던 el을 배워보자 in jsap page에서 ${ }을 사용했을 때에는 주로 cpath를 넣기 위해서만 사용했었다. String myName="김구라"; /* page scope 에 "myName" 이라는 키값으로 myName 담기 해당 jsp 페이지 에서만 사용할수 있다. */ pageContext.setAttribute("myName", myName); String yourName="해골"; /* request scope 에 "yourName" 이라는 .. 2023. 6. 13.

티스토리툴바