practice/vue.js

vue.js로 블로그 만들기 시작! vue3로 새 파일을 생성 Bootstrap사이트에 들어가서 설치명령어를 터미널에 써준다. 1) Module not found: Error: Can't resolve '@popperjs/core' in 어쩌구 하는 에러가 뜨면

데이터를 가져온다. ex)export defaultprops데이터 바인딩src파일에 router.js를 만들어준다. path에는 이동할 주소를 적어준다.main.js에 새로 만든 라우터를 import 해준다. 이동할 페이지가 생기면 라우터에 똑같이 적어주고

id는 (요부분 : path: "/detail/:id") 아무 주소나 넣을 수 있는 요소인데 (아무렇게나 작명 가능)Detail.vue에서 export default 로 props에 블로그글 내용 가져오고위에서 {{$route.params.id}} 요렇게 쓰이면 파라미

Nested routes란? 특정 페이지 내에서 또 라우트를 나누는 경우를 말한다.다른 UI로 만들어둬서 뒤로가기 앞으로가기 버튼을 동작시킬 수 있음.router.js에 children : {} 안에 만들어준다.그리고 보여주고싶은곳에 해준다.페이지 이동할 때는 $ro

Hash mode vs HTML5 mode

이번에는 Vue3를 사용해서 인스타그램을 만들어볼테다.만들기 전에는 먼저 기획을 해주는거시좋다.1번은 항상 고정되어 있는 상하단 메뉴로 App.vue를 활용해줄거임2번은 팔로잉 한 게시물이 들어올 때도 있고, 게시물 올리는 내용이 들어와야 할 때도 있고, 마이페이지,

App -> Container -> Post로 Props사용해서 데이터 전달해줬으면아래 사진처럼 데이터 바인딩 해준다.사진 바인딩 할 때는 background url이 잘 먹는다.백틱 사용도 유용함.참고로 css 작성중에는 '-'사용이 불가능하다. CamelCase 사

서버로 ajax 요청하는 더보기 버튼 만들기 를 하기에 앞서 Ajax가 무엇인지 먼저 알아볼테야 를 하기에 앞서 서버를 알아볼테야 서버란? 클라이언트가 데이터를 요청하면 데이터를 주는 프로그램. 서버에 데이터를 요청하려면 GET / POST 요청 이라는 방법을

버튼 0을 누르면 내용 0을 보여줌step이 0이면 내용 0을, 1일때는 내용 1일 보여줌v-if사용버튼 0을 누르면 step을 0으로 바꾸도록 @click 사용이 방법을 이용해서 뷰스타그램 탭을 만들어 보쟈( \* 왜 탭을 사용하냐 : 뒤로가기 버튼이 잘 먹고 간단한