디자인과 친구 도와주기 23.08.09

방학동안 친구 소개로 디자인과에 아는 동생이 생겼다. 

이  동생이 웹 프로그래밍에 대해서 배우고 싶다고 해서 하게된

디자인과 졸업작품 서포트용 Vue.js기반 홈페이지 프로젝트 

목표는 남은 8월 내내 Vue를 배우고

23년 하반기에 웹 페이지를 디자인하고, 프로그래밍언어를 배우면서 배포까지 해보는것이다.

나와 디자인과 동생이 웹 프론트 개발을 담당하고, 친구가 서버를 담당하기로 했다.

 

공부하는데 사용할 책은 이 책이다.

Vue.js 철저 입문: 기초부터 실전 애플리케이션 개발까지 | 위키북스 (wikibook.co.kr)

Vue.js 철저 입문: 기초부터 실전 애플리케이션 개발까지

 

Vue(이하 뷰)는 React(리액트)/React-Native와 비슷하게 웹 개발을 편하게 하기 위해서 개발된 자바스크립트 기반의 웹 프레임워크다. 

ChatGPT4에게 이 둘의 차이점을 물어보면 이렇게 답해준다.

1. 개념 및 철학:
   • React: 페이스북이 만든 라이브러리로, 주로 UI의 뷰 레이어를 담당합니다. 다른 상태 관리 도구와 함께 사용하면 더 강력해집니다.
   • Vue: UI와 비즈니스 로직 레이어를 모두 포함하는 프레임워크로, 점진적으로 채택 가능한 구조로 설계되었습니다.
2. 데이터 바인딩:
   • React: 단방향 데이터 흐름을 사용하여 컴포넌트 간의 명확한 데이터 흐름을 유지합니다.
   • Vue: 양방향 데이터 바인딩을 지원하여 특정 경우에 더 간결한 코드 작성이 가능합니다.
3. 구문:
   • React: JSX를 사용하여 자바스크립트 내에서 HTML과 유사한 문법을 사용합니다.
   • Vue: HTML 기반 템플릿을 사용하며, 스크립트와 스타일을 동일한 파일 내에서 관리할 수 있습니다.
4. 상태 관리:
   • React: Redux와 같은 별도의 상태 관리 라이브러리와 함께 사용될 수 있습니다.
   • Vue: Vuex와 같은 Vue 전용 상태 관리 패턴이 있어 통합이 더 쉽습니다.
5. 생태계 및 커뮤니티:
   • React: 큰 생태계와 커뮤니티를 가지고 있으며, 다양한 라이브러리와 도구와의 통합이 용이합니다.
   • Vue: 비교적 작은 생태계를 가지고 있지만, 쉬운 학습 곡선과 함께 강력한 기능을 제공합니다.
6. 성능:
   • 둘 다 높은 성능을 제공하지만, 사용 사례에 따라 약간의 차이가 있을 수 있습니다.
7. 라이선스:
   • React: Facebook의 특별한 특허 문항이 있었으나, 이후 MIT 라이선스로 변경되었습니다.
   • Vue: MIT 라이선스로, 오픈 소스 프로젝트에 유리합니다.

몇일 자료를 뒤적거리면서 찾은 내용으로는

리액트는 소-중규모 프로젝트에 자주 사용되어 짧은 스프린트 기간을 갖는 프로젝트들에서 주로 많이 사용하고, META가 관리하고 있어서 거대한 커뮤니티를 가지고 있다는 장점이 있고, 차세대 프레임워크로 NEXT.JS가 개발되고 있다. 

반면에 

뷰는 중-대형 프로젝트에 자주 사용되어 주로 공공기관 프로젝트 또는 대형 SI에 자주 사용되고 있고, 코드가 일관성있게 유지되어 배우기 편하고 짧은 러닝커브를 가지고 있어서 다수의 사용자들을 흡수하고 있고, 차세대 프레임워크로 NUXT.JS가 개발되고 있다.

개인적으로는 나는 리액트와 같은 개발철학 스타일을 더 선호하는 편이기는 하다. 뷰의 정답이 있는 코드라는건 기능을 구현하는데 있어서 생각을 제한할 수 있다는 소리이기도 하니까. 하지만 코드가 너무 깔끔해서 실수한 부분들이 눈에 잘 들어와서 오타찾는게 중요한 입문자에게는 뷰가 더 좋을거같아서 뷰를 선택하게 되었다.

일단 리액트 네이티브로 모바일 어플리케이션을 개발해본 경험을 뷰와 비교해보면 뷰는 파일들이 계층적 구조를 갖는다는 점이 나에게는 상당히 매력적으로 다가왔다. 여러개의 프로젝트를 단 하나의 작업폴더에 쑤셔놓고 경로를 바꿔가면서 빌드하는 나한테는 이게 더 익숙하거든..

겸사겸사 개발중이던 VSCODE확장 개발도 뷰를 적용시켜볼까 한다.

그래봣자 OPENAI GPT대화내역 클론코딩이지만...?

 

아무튼!

2학기 때 9학점만 수강할 생각이었는데 이것저것 할게 더 많아졋다. 살려줘요 LJY씨....TT

아 참, 태풍이 북상한다고 한다. 아직은 경로상 안전반원 안이기는 한데 자꾸 왼쪽으로 꺾여오는거 보니까 위험반원으로 들어갈수도 있겟더라. 

다들 몸조심하세요~

++내가 잘 도와줄수 있을까 걱정되기는한다. 전에 아는 동생 도와준다고 도와줬는데 내가 말을 잘하는 편이 아니고, 나도 같이 공부하는 입장이었어서 잘못된 내용을 가르쳐주면 그건 내 책임이니까 엄청 조심스러웠거든...오히려 그 친구 공부하는데 방해만 한것 같고 지금와서는 더 잘 도와줄 수 있는 방법이 있지 않았을까? 하는 후회도 있다. 그래서 이번엔 그냥 솔직하게 제로베이스에서 시작할 수 있는 뷰로 프로젝트 하는거기도하다 ㅎㅎㅎㅎㅎ 나도 배우는거니까 모르는거 나도 물어보면서 토론할거거든 ㅎㅎㅎㅎㅎㅎㅎㅎㅎㅎㅎㅎㅎㅎㅎㅎ 

 

 

 

 

ps. Vue 2의 LST 지원이 2023.12.31을 기점으로 종료될 예정이기 때문에 사용하는 책이 Vue 3 기반 책으로 변경되었습니다. "Youngjin.com의 한 권으로 배우는 Vue.js 3"(김동혁 저자)를 사용합니다.