여씨의 개발이야기

코딩애플 강좌 듣는 도중 문제가 생겼다. 강좌 내용을 응용하여 반복문을 이용한 div 내에 img 태그를 삽입하려는데, 이 때 변수를 이용해 다양한 이미지를 삽입하고 싶었다. before 처음 시도. :src를 입력한 뒤에 데이터 바인딩을 이용해 반복문의 키값을 넣어주려 했다. 결과는 실패. GET http://localhost:8080/img/assets/room0.jpg 404 (Not Found)라는 에러가 뜨며 모두 엑박이 떴다. {{item}} 가격은? 허위매물신고 신고수 : {{report[i]}} after 이런저런 방법을 찾아본 결과, require를 이용하면 변수를 사용할 수 있다고 한다. 그래서 다음과 같이 작성해보았다. {{item}} 가격은? 허위매물신고 신고수 : {{report[..

해당 에러는 위와 같이 v-for를 사용했을 때 나는 에러이다. v-for를 사용할 경우에 키값도 같이 지정을 해줘야 한다. 그렇기때문에 아래와 같이 수정하였다 {{p}} 가격은?

Nodejs설치하면 npm을 쓸 수 있음 npm이란 각종 웹 개발 라이브러리 설치 도우미로 'Node Package Manager'의 줄임말이다. npm으로 @vue/cli 설치할 수 있음 @vue/cli란 vue 프로젝트를 자동으로 빨리 생성해주는 라이브러리이며 프로젝트 생성은 vue create 프로젝트명 으로 할 수 있다. 프로젝트 구조 node_modules: 프로젝트에 쓰는 라이브러리들 src: 소스코드가 다 담기는 곳 public: html파일, 기타파일 보관하는 곳 package.json: 라이브러리 버전, 프로젝트 설정 기록하는 파일

vetur html css supports vue3 Snippets

보통 우리는 같은 사이트 내에서 다른 페이지로 이동하고자 할 때는 아래와 같이 라우터를 이용해서 redirect하는 방식을 이용한다. this.$router.push("/about"); 하지만 우리가 알아보고자 하는 방법은 같은 사이트 내부가 아닌, 외부 URL을 redirect하는 것이다. 아래의 소스를 보겠다. 해당 소스는 vue앱에 /contact 경로가 있다고 가정할 때, 사용자가 /contact 페이지를 접속할 경우 외부 url인 https://www.google.com/contact/ 페이지를 접속하고자 한다. 가장 쉬운 방법으로는 /contact 와 연결된 소스에 window.location.href 속성을 사용하면 된다. Contact.js Contact Page 위의 소스에서, creat..

드디어 jsp의 지옥에서 벗어난 나. 그동안 jsp로 짜여진 스파게티 코드를 질릴대로 본 나는 jsp와 권태기를 갖게 되었고... (다른 언어라고 다를 줄 알겠냐는 질문이 들어오겠지만 한 언어로 개떡같이 작성된 코드를 n년간 봐온다면 정말정말 그 언어가 싫어집니다! 아시궜어요!😭) 이번 프로젝트에서는 Vue 기반의 웹앱을 확장 개발한다는 얘기를 듣고 프론트 개발을 해보고 싶다고 스리슬쩍 부장님께 부탁을 드린게 바로 컨펌이 떨어졌다. 기쁨도 잠시, 사아실 나는 Vue 공식문서조차도 제대로 읽지 않았던 거시였다... 원래 다 이렇게 개발이랑 공부랑 동시에 하잖아요?^^... Vue js랑 많이 비교되고 비슷한 놈이 무엇이더냐 한다믄 React를 대표적으로 많이들 뽑을 것이고 (Angular도 있다.) 필자는..