본문 바로가기
  • 문과생의 백엔드 개발자 성장기

전체 글199

210913_Vue.js (Axios, flask) • 복습 Sign Up Form ID PW NAME ADDRESS PHONE 사원추가 Key enter axios Axios는 브라우저, Vue.js , Node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리 1) Arrow 함수 2) Vue 라이프 사이클 3) Vue의 비동기 , 동적 데이터 바인딩 • arrow function • life cycle Vue 인스턴스가 생성될때 내부적으로 중요한 몇 단계를 거친다. 이를 라이프 싸이클 메소드(Call Back Method) 로 확인 가능하다. 1. created vue 인스턴스 생성된 직 후 created 가 Hook(call)된다. 이때 el, data, methods, filters, computed 같은 속성들이 활성.. 2021. 9. 13.
210910_Vue.js(event : v-cloak, v-once) • 복습 KERY HRM LIST 사원추가 | 이름으로 찾기 | 아이디로 찾기 | 모든사원 보기 사원 아이디 사원명 부서 직책 연봉 {{emp.id}} {{emp.name}} {{emp.dept_id}} {{emp.title}} {{emp.salary | salarydecimal}} /* table. css*/ @CHARSET "UTF-8"; /* input elements */ input{font-size:12px;} textarea{font-size:12px;} input.txt{padding-top:3px; height:18px;} select{font-size:12px; height:20px;} .headtitle { margin:auto; padding:0px; text-align:center;.. 2021. 9. 10.
210909_Vue.js(v-for, v-if, v-show) v-for :: 일종의 for문, 데이터를 여러개 받아와서 한번에 출력할 수 있다. {{n}} 이름나이 {{p.name}} {{p.age}} v-if, v-show 나는 보입니다 나는 보입니다 methods (v-on:click, @click) {{title}} {{title}} $data 일반 javascript :: 클릭이벤트 {{title}} {{showInfo()}} {{showInfo2('James')}} {{title}} filters {{title}} {{title|toUpper}} {{title|toLower}} {{title}} {{title|concatStr}} v-model 다음 중식 음식 메뉴입니다. 좋아하시는 메뉴들을 있는대로 고르세요 짜장면 탕수육 팔보채 짬뽕 난자완스 울면 ==.. 2021. 9. 9.
210908_jQuery UI/Vue.js(Mustache, Directive, v-bind) jQuery UI https://jqueryui.com/ jQuery UI jQuery UI is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library. Whether you're building highly interactive web applications or you just need to add a date picker to a form control, jQue jqueryui.com Datepicker Date: Tabs 경제 상식 정치 이슈 코로나 현황 제목 내용 내용 Accordion 윈드브레이커 혼자서 자전거를 즐겨타던 모범생 조.. 2021. 9. 8.
210907_jQuery_Ajax (servlet, LocalStorage) jQuery 함수 2 each () 1) 동일한 태그가 여러개 있을 때 사용, each()가 태그의 갯수만큼 호출 2) 배열에서 사용, each()가 배열안에 있는 데이터의 갯수만큼 호출 select 와 each 함수 Form에서 전송한 값을 Jquery에서 받아서 처리한 후 서버로 전송하는 방법 Form에서 전송한 값을 Jquery에서 받아서 처리한 후 서버로 전송하는 방법 ID : PASSWORD : NAME : 정보를 출력합니다 ${param.id}님의 이름은 ${param.name} 입니다. Checkbox submit ID PASSWORD 당신의 취미를 고르세요 독서 드라이빙 술마시기 음악감상 RESULT PAGE Ajax (Asynchronous JavaScript and XML) Ajax는 .. 2021. 9. 7.
210906_jQuery (bind, hover, find, traversal, click, key) EVENT mouseenter + mouseleave (마우스 포인터가 진입 + 퇴출할때 발생하는 이벤트) jQuery is a fast, small, and feature-rich JavaScript library jQuery is a fast, small, and feature-rich JavaScript library jQuery is a fast, small, and feature-rich JavaScript library hover : 마우스 이벤트 포커스 2가지(moseenter, mouseleave)를 동시에 가지고 있는 함수 jQuery is a fast, small, and feature-rich JavaScript library jQuery is a fast, small, and fea.. 2021. 9. 6.
210903_jQuery(기본 실행 및 Template, 함수) jQuery jQuery는 기능이 풍부한 JavaScript 라이브러리 HTML 문서 트래버설 및 조작, 이벤트 처리, 애니메이션 및 Ajax와 같은 작업을 여러 브라우저에서 쉽게 사용할 수 있는 API를 통해 훨씬 더 간단하게 수행할 수 있다. 다운로드 또는 설치 방법 CDN 이용방법 https://jquery.com/download/ 위의 url 접속 후 원하는 CDN 누른 후 위 코드를 복사 후 붙여넣기 하여 사용한다. (가장 상위 사용하는 것 추천) jQuery ready What is jQuery? jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and .. 2021. 9. 3.
210902_JavaScript (function, 비동기) JavaScript JavaScript는 웹의 프로그래밍 언어이다 Basic window.onload() 함수와 복합연산자 원칙상 자바스크립트의 document.getElementById("wrap").innerHTML = list; 가 html 내부 id의 wrap이란 태그가 생성되기 전에 실행 되면서 에러가 발생한다. 따라서 자바스크립트 문서를 html 뒤로 옮겨서 작성해야한다. 그러나 자바스크립트 아래쪽에 놓여있으면 가독성이 떨어지기 때문에 이러한 불편함을 해결하기 위해 문서앞에 선언해도 상관없게 하는 함수가 window.onload이다. window.onload함수를 오버라이딩(재정의) 해주면 되는데 해당 함수 내의 코드 스크립트는 웹 브라우저 내의 모든 요소가 준비가 되어야 실행 될 수 있다. .. 2021. 9. 2.
210901_CSS(overflow, BoxModel, Bootstrap) Overflow CSS 오버플로 속성은 너무 커서 영역에 맞지 않는 콘텐츠의 동작을 제어한다. Overflow 속성 visible - Default. The overflow is not clipped. 내용이 요소의 상자 외부로 렌더링됨 hidden - Overflow가 잘리고 나머지 컨텐츠는 표시되지 않는다. scroll - Overflow가 잘리고 스크롤 막대가 추가되어 나머지 내용을 확인한다. auto - 스크롤과 유사하지만 필요한 경우에만 스크롤 막대를 추가한다. visible Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec mollis nulla. Phasellus lacinia tempus mauris eu laoreet.. 2021. 9. 1.

티스토리툴바