목록WEB DEVELOP (22)
정구리의 우주정복
Omit : 객체 형태의 타입에서 특정한 프로퍼티들을 제외 시켜줌 ( 객체 에서 프로퍼티 를 제외 ) Pick : 객체 형태의 타입에서 특정한 프로퍼티들을 선택 해줌 ( 객체에서 프로퍼티 를 선택) Exclude : 여러개의 타입이 함께 존재하는 유니언 타입에서 특정 타입을 제거해준다 ( 타입 에서 타입 을 제외 ) Omit 특성 속성만 제거한 타입을 정의할 수 있다 (Pick 의 반대) // interface 생성 interface Food { hambuger : string; chicken : string; pizza : string; hotdog : string; } // Food 에서 hambuger 를 제외해준다 type WithoutFood = Omit // hambuger 을 제외한 나머지를..
div 태그를 input 태그처럼 사용하고싶어요div 태그에 내용을 직접 입력하는 input 태그 형태로 만들고 싶다면 contenteditable 을 사용하면 된다 내용내용은 input 태그의 value 라고 생각하면 된다 placeholder 를 사용하고싶어요div 태그에 아무리 placeholder 를 줘도 동작하지 않는것을 확인할 수 있다. 그럴땐 div 태그에 원하는 placeholder 를 적어주고 style 태그에 아래의 내용을 넣어주면 된다 이렇게 작성하고 css style 부분에 이렇게 적어주면 된다 ! [contenteditable]:empty:before { content: attr(placeholder); } 만약 contenteditable=‘true’ 이렇게 써줬으면 style ..
https://nodejs.org/ko/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 우선 node 를 설치하자 이거 입력해서 결과 잘 나오면 잘 설치 된거다 그리고 vue 를 설치해주자 sudo npm install -g @vue/cli 이 명령어 사용하면 된다 이후 프로젝트를 하고자 하는 폴더로 이동한 후에 vue create 프로젝트명 을 적고 이거 설치하면 된당 만약 아래에 해당하는 에러가 나온다면 https://github.com/npm/cli/issues/5114 [BUG] npm incorrectly assumes existence of root-owned files on ..
내가 이해한거 바탕으로 적어본다 제네릭 사용하는 경우 : 다양한 타입들이 올 수 있는 경우에 사용한다 타입가드 사용하는 경우 : (is 사용하는거) 넓은 타입을 좁혀줄때 사용한다 ex) number | string 을 string 하나로 바꿔주고 싶다던지 extends 를 사용하는경우 : 부분집합임을 표현할 때 사용한다 ex ) filter(callback : (v: T) => v is S ) : S[]; S가 T의 부분집합임을 표현할 때 사용한다 interface Arr { forEach(callback : (item : T) => void):void; map(callback:(v : T) => S ):S[]; filter(callback : (v: T) => v is S ) : S[]; } const..
php 에서 for 문 사용법과 count() 를 사용해서 배열의 길이를 구해보자 for 문 사용법 사용 예시
Links 버튼을 누르면 밑에 검은색 박스가 나오고 박스 안에는 내가 자주가는 링크를 등록해 놓을 수 있다. 기본으로 크롬은 있고 new 버튼을 눌러서 나온 삽입하는데에 insert 해주면 링크가 생긴다 ! 엄청 신기하군 ! HTML 코드 Links Chrome Tab NEW INSERT 자바스크립트 코드 const js_link=document.querySelector(".js-link"); const links=js_link.querySelector(".links"); const box=js_link.querySelector(".linklist-box"); const list=js_link.querySelector('.links-list'); const newBtn=js_link.querySelect..
자바스크립트로 만든 투두리스트 ! 아직 쪼질이라서 코드가 더럽다 localStorage 를 사용해서 새로고침을 해도 데이터가 남아있다는 엄청난 사실 ! HTML 코드 What is your Main Focus for Today ? 자바스크립트 코드 const toDoForm=document.querySelector('.js-toDoForm'); const toDoInput=toDoForm.querySelector('input'); const toDoList=document.querySelector('.js-toDoList'); const TODOS_LS='toDos'; let toDos=[]; //empty array to save todo function deletToDo(event){ //How to..
만든지는 한달이 넘은것같은데 이제서야 올린다 (게을러서) 최종 구현한 애들은 맨 위에서부터 ) 1) 날씨 (현재 위치를 받아와서 지역의 기온을 표시) 2) 날짜 , 시간 3) 사용자의 이름을 받아와 시간대별로 Good Morning (이름) 이런식으로 출력 4) ToDo List 5) 자주 사용하는 링크를 등록, 클릭시 바로 이동 6) 명언 출력( 웹에서 받아와서 출력하는거면 더 좋았겠지만 나의 한계) 7) ToDo 버튼 클릭시 현재 투두리스트의 내용을 출력 8) 돋보기 모양 클릭 후 검색할 키워드를 입력하면 바로 구글에 검색 ! 9) 자동 배경 바꾸기 이렇게 구현해 보았다 사실 CSS를 했으면 더 좋았겠지만 지금은 굳이 시간 들여서 할 필요를 못느낌 ! (귀찮은거아님!) 이제 코드 하나하나 올리면서 기..