기록저장소

https://inpa.tistory.com/m/entry/%EB%93%9C%EB%9E%98%EA%B7%B8-%EC%95%A4-%EB%93%9C%EB%A1%AD-Drag-Drop-%EA%B8%B0%EB%8A%A5 [JS] 📚 드래그 앤 드롭(Drag and Drop) 기능 이해 & 구현하기 HTML & JS 드래그 앤 드롭 드래그(drag)와 드롭(drop)은 컴퓨터를 이용하면서 정말 많이 사용하는 기능 중에 하나일 것이다. 파일 애플리케이션에서 문서를 복사해 이동하는 것 부터 주문 하려는 물건 inpa.tistory.com

https://okayoon.tistory.com/entry/input-%ED%83%80%EC%9E%85-range-%EC%8A%A4%ED%83%80%EC%9D%BC-%EC%88%98%EC%A0%95%ED%95%98%EA%B8%B0%EC%BB%A4%EC%8A%A4%ED%85%80-%EC%8A%A4%ED%83%80%EC%9D%BC input 타입 range 스타일 수정하기_커스텀 스타일 ++ 추가 사항 태그로 제작한 부분이 모바일에서 터치 이동이 안되는 이슈가 있었습니다. 그래서 어쩔수 없이 태그를 사용하여 커스텀하는 형식으로 작업했습니다. 기록상 글을 작성합니다. 글 okayoon.tistory.com

https://stackoverflow.com/questions/29715655/html-5-input-type-date-disable-keyboard-input HTML 5 Input type='date' disable keyboard input I am working on a Chrome Packaged App so my code should only work in Chrome. I have the following input https://jsfiddle.net/jhbo4q2k/ On Chrome this automatically ... stackoverflow.com

Drag'n'Drop File Here .drop { min-height: 50px; width: 250px; border: 1px solid blue; margin: 10px; padding: 10px; } if(window.FileReader) { //var drop; addEventHandler(window, 'load', function() { var status = document.getElementsByClassName('status')[0]; var drop = document.getElementsByClassName('drop')[0]; var list = document.getElementsByClassName('list')[0]; function cancel(e) { if (e.prev..

19강. 이벤트 state props 그리고 render 함수 class App extends Component{ constructor(props){ super(props); this.state = { // //읽기, 클릭 구분을 위한 mode mode:'welcome', subject:{title:"WEB", sub:"World wide Web!"}, welcome:{title:"welcome", desc:"Hello, React!"}, // contents:[ {id:1, title:'HTML', desc: 'HTML is ..'}, {id:2, title:'CSS', desc: 'CSS is ..'}, {id:3, title:'JS', desc: 'JS is ..'} ] } } //↑ props o..

13강. props class Subject extends Component{ render(){ return( {this.props.title} {this.props.sub} ); } } class App extends Component{ render(){ return( ); } } 14강. React Developer Tools 개발자 도구에서 리액트 컴포넌트 확인 가능, 임시 수정 가능 15강. Component 파일로 분리하기 //TOC.js 생성 //error. 'Component' is not defined 해결 //react에서 {component} 노드 로딩 import React, { Component } from 'react'; class TOC extends Component{ rend..

7강. JS 코딩하는 법 //index.html //index.js const root = ReactDom.createRoot(document.getElementById('root')); root.render(

4강. npm을 이용해서 create-react-app 설치 1. npm을 이용하여 create-react-app 설치하기 1) node.js 설치 : https://nodejs.org/ko/ 2) cmd 창 열기 : window+R -> cmd *cmd : 컴퓨터를 명령어를 이용하여 제어하는 프로그램 npm -v//npm 버전확인 3) 설치하기 npm install -g create-react-app sudo npm install create-react-app//권한이 없을 경우 3-1) npm 또는 node의 버전 업그레이드를 요구할 때 npm install -g npm@8.15.1//npm 버전 업그레이드 node버전 업그레이드 : https://nodejs.org/ko/ 에서 최신버전 재다운로드 ..

#_자료구조 : 효율적으로 데이터를 관리하고 수정, 삭제, 탐색, 저장할 수 있는 데이터 집합, C++는 STL을 기반으로 전반적인 자료구조를 잘 설명할 수 있는 언어 *STL : C++의 표준 템플릿 라이브러리이자 스택, 배열 등 데이터 구조의 함수 등을 제공하는 라이브러리 묶음 #include //(1) using namespace std;//(2) string a;//(3) int main() { cin >> a;//(4) cout

#_데이터베이스 (DB, DataBase) : 일정한 규칙, 규약을 통해 구조화되어 저장되는 데이터 모음, DB내의 데이터드릉ㄴ 특정 DBMS마다 정리된 쿼리언어를 통해 삽입, 삭제, 수정, 조회 등 CRUD 수행가능, 실시간 접근과 동시공유 가능 #_DBMS (DataBase Management System) : 해당 데이터베이스를 제어, 관리하는 통합시스템 #_엔터티 (entity) : 사람, 장소, 물건, 사건, 개념 등 여러개의 속성을 지닌 명사, 서비스의 요구사항에 맞춰 엔터티의 속성이 정해짐 *약한 엔터티와 강한 엔터티 : A가 혼자서는 존재하지 못하고 B의 존재여부에 따라 종속적일 경우 A는 약한 엔터티, B는 강한 엔터티 #_릴레이션 (relation) : DB에서 정보를 구분하여 저장하는..