inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

Vue.js 시작하기 - Age of Vue.js

라우터 정리 및 학습 방향 안내

3:43 '#' 해시 유무의 차이

267

얼그레이

작성한 질문수 96

1

있고 없고 무슨 차이에요?

왜 저게 달려오는거죠..?

javascript vue.js

답변 2

0

캡틴판교

네 인수님, 브라우저 URL에 #가 붙으면 브라우저가 페이지 이동을 시키지 않아요. 반대로 #가 없이 일반 naver.com/abc

요런 형태로 되면 눌렀을 때 브라우저가 페이지 전환을 시도합니다. 이후 강의 로드맵 따라가시면 완벽 가이드 쪽에 좀 더 자세한 내용이 나올거예요 :)

0

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴입니다.
insoo님, 웹 애플리케이션에서 ‘#‘는 해시(또는 프래그먼트)를 나타냅니다. URL에서 해시(#) 다음에 오는 문자열은 서버로 전송되지 않고, 브라우저에서만 사용됩니다. 예를 들어, ‘#about’이라는 해시가 포함된 URL은 브라우저가 ‘about’이라는 ID를 가진 HTML 요소로 페이지 내에서 이동하도록 할 수 있죠.

Vue.js와 같은 싱글 페이지 애플리케이션(SPA)에서는 해시를 통해 각각의 뷰나 컴포넌트로 라우팅할 때 사용할 수 있습니다. 해시가 없는 경우에는 서버에서 해당 경로에 맞는 페이지를 새로 로드해야 하는데, SPA의 경우에는 페이지 전체를 새로 읽지 않고 필요한 부분만 변경하기 때문에 해시를 사용하면 유용합니다.

해시가 있는 URL은 서버에게 다른 페이지를 요청하는 것이 아니라, 현재 페이지를 유지한 채로 클라이언트 측에서 경로를 관리하고 싶을 때 사용됩니다. Vue.js에서는 Vue Router를 통해 해시 모드와 히스토리 모드 중 선택하여 사용할 수 있는데, 해시 모드는 URL에 ‘#‘가 붙게 됩니다. 이는 브라우저가 페이지를 새로고침하지 않고도 애플리케이션 내에서 라우팅을 할 수 있게 도와줍니다.

개발자 툴에서 Vue가 표시되지 않는 현상.

0

93

2

chrome 확장 devtools 버전 문제

0

81

1

Vue.js not detected가 자꾸 뜹니다

0

83

2

마지막 강의가 안되요

0

57

1

data, computed, watch > Reactivity

0

51

1

f12누르고 개발자도구에 vue 탭이 안생겨요

0

89

1

vue composition api

0

73

1

강의 자료 다운이 될까요?

0

128

1

개발자 도구에서 뷰탭이 안보여요....

0

588

3

프롭스 데이터 질문입니다.

0

113

1

component.html:11 Uncaught ReferenceError: Vue is not defined at component.html:11:20 (anonymous) @ component.html:11

0

141

1

화면이 안떠요,, 이전 이후 강의는 뜨는데..

0

236

6

크롬 확장 프로그램 vue devtools 설치했는데

0

537

2

코드를 수정하고 브라우저의 Vue로 넘어가면 다운이 됩니다.

0

243

1

버튼을 클릭해도 event가 발생하지 않습니다.

0

310

1

vue3 css 경로 표시 문의

1

231

2

개발자도구 vue탭

0

356

1

화면 코드 보기

1

226

2

App.vue 내용 변경했는데 창이 연결할수없대요ㅜㅜ

1

384

2

html/css/js로 작성된 코드를 vue.js로 일부 전환하고자 이 강의를 듣기 시작했습니다.

1

888

2

Vue 개발자 도구에서 다른 기능들이 안보여요!

1

601

2

{{ num }} 이 <app-content> 아래에 들어가 있을때에는 노출이 안됩니다...

1

288

2

뷰 개발자도구 이벤트 타임라인 어느 부분에서 확인가능한건가요

1

401

2

다음 단계 강의는...?

1

387

2