🚀 Axios란? JavaScript Application에서 Server 즉, Back End와의 통신을 하기 위한 HTTP Library가 바로 Axios라는 친구에요. 이 친구는 Vue.js에 종속된 것이 아니라 다른 JavaScript Application 즉, React.js 등에도 이용할 수 있는 것이에요. Web이나, App을 개발하다 보면 우리는 Data를 저장하고, 불러오기 위해 Back End Server를 구축하고 이용해야 하는 것이에요. Axios는 Promise 기반의 JavaScript 비동기 처리 방식을 이용하는 것이에요. 그렇기 때문에 Request를 보낸 뒤 .then()을 이용해서 결과값을 받아 처리하는 형식으로 구성이 되어 있답니다. axios.get('/api/data..

🧑🏻‍💻 Git Hub 주소 🗂 목차 ● [FrontEnd][Vue-PJ] 개발자 커뮤니티 서비스 - Home / Main ● [FrontEnd][Vue-PJ] 개발자 커뮤니티 서비스 - 게시판 만들기 : 목록 조회 ● [FrontEnd][Vue-PJ] 개발자 커뮤니티 서비스 - 게시판 만들기 : 상세 조회 ● [FrontEnd][Vue-PJ] 개발자 커뮤니티 서비스 - 게시판 만들기 : 등록 / 수정 ● [FrontEnd][Vue-PJ] 개발자 커뮤니티 서비스 - 게시판 만들기 : 삭제 ● [FrontEnd][Vue-PJ] 개발자 커뮤니티 서비스 - 게시판 만들기 : 답변 등록 / 수정 ● [FrontEnd][Vue-PJ] 개발자 커뮤니티 서비스 - 게시판 만들기 : 답변 삭제 👨‍👩‍👧‍..

🚀 lodash란? 이 친구는 JavaScript의 인기 있는 Library중에 하나 인 것이에요. 보통의 경우 Array, Collection, data 등 Data의 필수적인 구조를 쉽게 다룰 수 있게 해주는데 사용하는 것이에요. JavaScript에서 배열 안에 객체들의 값을 handling(배열, 객체 및 문자열 반복 / 복합적인 함수 생성)할 때 유용한 것이에요. 이러한 점으로 인해 JavaScript의 코드를 줄여주고, 빠른 작업에 도움을 주는 친구랍니다. 특히 Front End 환경에서 많이 이용하고 있는 것이에요. `_.(변수명)`과 같은식으로 작성할 경우 lodash Wrapper로 변수를 감싸게 되면서 해당 변수에 대한 chaining을 시작하는 것이에요. `_` 기호를 이용해서 사용되..

⚠️ 문제 발생! 🤔 원인 분석 위 문제는 lodash 라는 친구를 받지 않고, 그 것을 사용하려고 해서 발생한 문제와 더불어 `_.ceil` 형식으로 써야 하는데, 단지 `.ceil` 만 써서 발생한 문제인 것이에요. 🍻 문제 해결! npm을 통해 위와 같이 `lodash`를 먼저 설치 해 주어야 하는 것이에요. return _.ceil(this.totalCount / this.rowCount); return _.range(start, end + 1); 그런 뒤 위와 같은 문법을 사용하면 정상 이용 가능 하답니다!

⚠️ 문제 발생! 분명 위와 같이 열심히 코딩을 해 두었는데, Contents 부에 그 어떤 화면도 보이지 않는 문제가 발생한 것이에요. 🤔 원인 분석 이 문제에 대해 곰곰히 생각을 해보니 App.vue에 아래 그림과 같이 router를 통해서 Contents 부를 Re Rendering을 하는데, DevInquryList.vue는 Router에 대한 특별한 설정을 한 기억이 없는 것이에요. 역시 이것이 문제 였던 것이에요! 이건 구글링 하지도 않고 찾았네요! 👍👍👍 🍻 문제 해결! 위와 같이 화면이 출력이 되는 것을 볼 수 있는 것이에요. 보이는 게 약간 엉성해 보이는 것은 Back End 서버가 꺼져 있어서 Data Bindding을 못하기 때문이에요.

🧑🏻‍💻 Git Hub 주소 🗂 목차 ● [FrontEnd][Vue-PJ] 개발자 커뮤니티 서비스 - Home / Main ● [FrontEnd][Vue-PJ] 개발자 커뮤니티 서비스 - 게시판 만들기 : 목록 조회 ● [FrontEnd][Vue-PJ] 개발자 커뮤니티 서비스 - 게시판 만들기 : 상세 조회 ● [FrontEnd][Vue-PJ] 개발자 커뮤니티 서비스 - 게시판 만들기 : 등록 / 수정 ● [FrontEnd][Vue-PJ] 개발자 커뮤니티 서비스 - 게시판 만들기 : 삭제 ● [FrontEnd][Vue-PJ] 개발자 커뮤니티 서비스 - 게시판 만들기 : 답변 등록 / 수정 ● [FrontEnd][Vue-PJ] 개발자 커뮤니티 서비스 - 게시판 만들기 : 답변 삭제 👨‍👩‍👧‍..