Cute Hello Kitty 3
본문 바로가기
Frontend

[React] vue 와의 차이점

by 민 채 2024. 8. 26.

1학기 때는 커리큘럼 상으로 vue 를 학습했고 관통 프로젝트도 vue 로 진행했는데,

2학기 때는 react를 사용하게 되었다.

 

개인적으로 느끼는 vue 와 react 의 차이점에 대해 써보고자 함

 

학습 난이도

vue 는 프레임워크고 react는 라이브러리다.

그러다보니 vue 는 정형화 된 자체적인 문법 안에서 코드를 짜야한다.

반면, react는 자체적인 문법보다도 JS 문법을 많이 이용하는 느낌이었다.

 

싸피 커리큘럼 상 JS 는 일주일만에 후딱 배우고 넘어가기 때문에 

나는 JS가 익숙하지 않았고, vue 의 자체 문법은 되게 직관적인 편이기에

vue 가 더 쉽게 느껴졌다.

 

 

생태계

vue 는 확실히 생태계가 작다는 느낌을 받았다.

공통 프로젝트를 하면서 정말 다양한 라이브러리를 사용하게 되었는데,

react 관련 소스 코드는 많았던 반면, vue 와 관련된 소스 코드는 적은 편이었다.

react는 다양한 라이브러리를 땡겨쓰고 다른 사람들의 코드를 참고하며 빠르게 개발하기에 정말 좋았다.

 

 

사용성

vue 는 하위 컴포넌트에서 상위 컴포넌트로 직접 이벤트를 전송할 수 있었다.

- 하위 컴포넌트는 emit 을 통해 부모 컴포넌트에게 이벤트를 전송할 수 있다.

- 부모 컴포넌트는 v-on 을 사용하여 이 이벤트를 수신할 수 있다.

하지만, 리액트는 하위 컴포넌트에서 상위 컴포넌트로 이벤트를 직접 전달할 수 없다 !!!

 

처음에는 이것 때문에 굉장히 리액트가 어색하게 느껴졌다.

하지만, 직접 전달하지 않아도 다양한 방법을 통해 간접적으로 전달할 수 있는 방법이 많았다.

예를 들면,

1. 부모 컴포넌트에서 자식 컴포넌트로 signal 을 전달한다.

2. 자식 컴포넌트에서 이벤트가 발생할 때 signal 을 변경함으로써 부모에게 신호를 전달한다.

3. 부모 컴포넌트는 signal에 변화가 생긴 것을 보고 이벤트를 간접적으로 수신할 수 있다.

 

 

공통 프로젝트에서 react 를 처음 사용해보았는데, 처음엔 익숙치 않았지만 typescript 와의 궁합도 좋고 참고할 코드도 많아서 수월하게 프로젝트를 진행할 수 있었다.