본문 바로가기

분류 전체보기

(43)
Vue 프로젝트를 시작하자! [시작부터 오류발생...... 해결방법은!!!?] 계획만 해서는 안된다! 일단 시작을 하자! 작업 운영체제는 윈도우 (Window) npm 설치 시 맥에 비해서 오류가 많이 난다고 하는데.. 조금 걱정이 된다! 그래도 도--전!!!!!!! Vue3 프로젝트 시작 순서! 1. 프로젝트 폴더 아무 곳에나 생성 2. Vscode 에서 오픈 폴더 => 생성한 폴더 불러오기 3. 터미널에 npm install -g @vue/cli 입력!!! 후후....아니나 다를까 바ㅡ로 오류 발생!!!! ("허가되지 않은 스크립트 어쩌구 저쩌구") ㅡ.ㅡ 해결 방법 ???? 윈도우 검색메뉴(돋보기) 에서 Powershell을 검색하면 "Windows Powershell" 이 뜨는데 여기 우클릭을 해서 관리자 권한으로 실행!! 그리고 Set-ExecutionPolicy Unre..
[Vue3] 버튼 클릭 시 입력한 값 : data 값에 등록 만들고 싶은 것 값을 입력하고 클릭하면 출력되게 만들기 1. 인풋에 입력한 값 저장하기 2. 클릭하면 저장한 인풋 값을 데이터에 등록 3. 등록된 데이터 값 보여주기 Html type your list click {{text}} 1. @change="input" : input값이 변경되면 data에 업데이트 되도록 해야함 2. @click="click" : 버튼을 누르면 업데이트된 data값이 {{ text }} 에 출력되도록 만들기 Javascript const app = Vue.createApp({ data(){ return { text : '', //출력될 값 inputText : '' //input값 } }, methods:{ input(e){ return this.inputText = e.tar..
[Vue3 + TS] Event Target 에러 1. (event)에 타입 Event 설정해주기 2. event.target.textContent 하면 Property 'textContent' does not exist on type 'EventTarget' 에러 뜸 (event.target as HTMLLIElement).textContent 로 작성해주기 const dpText = ref('Dropdown Text'); const menuClik = (event: Event) => { const eText = (event.target as HTMLLIElement).textContent; dpText.value = eText; }; {{ item.menu }}
[JS] 두 배열 비교하여 중복되는 값 찾기 [1,2,3,4,5] 와 [2,4,5,7,8] 비교하여 중복값 찾아내기 예상 답 : 2,4,5 공감❤과 구독하기✔를 눌러주시면 블로거는 힘이나요😊
:after 과 ::after 의 차이점은 바로 이것입니다. :after은 CSS2에서 , ::after은 CSS3에서 사용하는 것입니다. 즉, 가상요소(Pseudo-elements)는 CSS2에서는 : 가 하나만 표기되고 CSS3에서는 :가 두개 표기됩니다. CSS3에서 ::after로 표기되는 이유는 가상클래스와 가상요소의 차이를 분명하게 하기 위함이라고 합니다. (둘 다 앞에 : 가 붙어서 헷갈릴까봐 차이를 주기위함인 것같음) 가상클래스 :hover, :active, :checked, :last-child ...등등 가상요소 ::after, ::before, ::first-letter, ::placeholder ...등등 하지만 호환성을 위해 :after, :before 도 허용됩니다. 결론. 가상클래스와 가상요소가 헷갈리지 않는 다면 그냥 :after, :..
[개발메모_01] 1. ftp에 첫 업로드 후, 그 다음부터의 css와 js의 업데이트가 사이트에 적용되지 않는경우에는 경로.css?ver=0.1 또는 경로.js?ver=0.1 와 같은 형식으로 버전 업데이트를 해줘야함 2. 카카오 지도 적용은 서버와 함께 적용해야 하므로 로컬에서 작업시, 적용이 안됨. (서버가 구축된 조건하에) ftp에 등록하여 해당 웹 경로에서 봐야 카카오 지도가 적용된 것을 볼 수 있음. 3. css 파일을 해상도별로 저장하여 따로 적용하는 방법. 예) pc.css / mobile.css 등등 지정해주기
[모던자바스크립트 - JS 예제 마스터] 오늘 날짜 구하기 오늘 예제는 당일 날짜를 보여주는 것이므로 에디터 결과물을 가져왔습니다. javascript 코드 var now = new Date(); var month = now.getMonth()+1; var day = now.getDate(); document.write("오늘은"+month +"월" + day +"일 입니다. "); 사실 날짜구하는건 제가 이미 할줄 아는 부분이고 쉬워서.. 하나만 설명하고 마칠게요! 왜 getMonth()에 1을 더해야하나요? getMonth()의 반환값이 0~11 이기 때문입니다. (그냥 그렇대요...w3school이 그랬어요..) 즉 1월은 0, 2월은 1 이렇게 나옵니다. 그래서 +1을 해줘야하는 거랍니당 :) 공감❤과 구독하기✔를 눌러주시면 블로거는 힘이나요😊
[모던자바스크립트 - JS 예제 마스터] 체질량 구하기 HTML 코드 키 : cm 몸무게 : kg 당신의 체질량지수는 ?입니다. Javascript 코드 window.onload = function(){ document.getElementById("button").onclick = function(){ var h = parseFloat(document.getElementById("height").value); var w = parseFloat(document.getElementById("weight").value); var bmi = document.getElementById("bmi"); bmi.innerHTML = (w/((h*h)/10000)).toFixed(1); } } 이번 예제는 크게 어려운 부분은 없었던 것 같아요. 하지만 또 새로운 메서드가 등..