본문 바로가기

분류 전체보기260

[Nuxt.js] 학습정리 Nuxt ? 파일 기반의 자동 라우팅 생성이 넉스트의 특징. - 디렉터리 구조 설명 [pages] pages 내부에 생성한 main.vue 페이지는 localhost:3000/main 으로 바로 접근이 가능하다. 폴더나 vue파일을 생성하고 서버를 실행하면 .nuxt/router.js 에서 해당 이름들을 확인 할 수 있다. [layouts] error 페이지는 layouts/error.vue 로 작성하면 자동으로 인식해서 존재하지 않는 경로를 요청 할 경우 자동으로 페이지를 넘겨준다. default.vue 공통된 UI들을 보여주고 싶을 때 사용한다. 헤더, 푸터 등 헤더에서 메뉴를 보여주고싶을때 vue에서는 를 사용했지만 nuxt에서는 홈페이지 로 변경하여 사용해준다. 는 는 nuxt에서 REST API.. 2022. 2. 1.
[ESlint] 유용한 ESlint 모음 순서 정렬 해주는 규칙 (ex. asyncData 는 data 위에 위치한다.) { "vue/order-in-components": ["error", { "order": [ "el", "name", "key", "parent", "functional", ["delimiters", "comments"], ["components", "directives", "filters"], "extends", "mixins", ["provide", "inject"], "ROUTER_GUARDS", "layout", "middleware", "validate", "scrollToTop", "transition", "loading", "inheritAttrs", "model", ["props", "propsData"], ".. 2022. 2. 1.
[Nuxt/error] [vue/no-multiple-template-root]The template root requires exactly one element.eslint-plugin-vue The ul element represents a list of items, where the order of the items is not important — that is, where changing the order would not materially change the meaning of the document. [vue/no-multiple-template-root] The template root requires exactly one element.eslint-plugin-vue ul 요소는 항목의 목록을 나타내며, 항목의 순서가 중요하지 않습니다. 즉, 순서를 변경하면 문서의 의미가 크게 변경되지 않습니다. [vue/no-super-root] 템플릿 루트에는 정확히 하나의 요소가 필요합니.. 2022. 2. 1.
[vue2 - error] Vue packages version mismatch: 온라인에서 다운로드받은 nuxt 프로젝트에서 오류가 발생했다. npm install > npm run dev 실행했더니 Vue Package version mismatch : 라는 오류가 발생. Vue packages version mismatch: - vue@2.6.14 - vue-server-renderer@2.6.12 package.json 파일에서 vue와 vue-server-renderer 의 버전이 명시되어있지 않아서 자동으로 최신 버전으로 업뎃을 했고, 그 결과 vue 와 vue-server-renderer의 버전이 일치하지 않는다는 내용. package.json 파일에 다음을 추가해준다. "vue": "^2.6.12", "vue-server-renderer": "^2.6.12", packa.. 2022. 1. 31.
[vue] eslint 가 아닌 prettier 가 적용 될 때 vs code 에서 별다른 설정을 만지지 않았음에도 불구하고 내가 원했던 대로 개행이 되지 않았다. 또한 자꾸 스크립트 부분에 작은 따옴표를 사용한다고 설정 해두었는데 저장할때마다 큰 따옴표로 변경되어 불편함을 느꼈다. 검색해보니 설정이 바뀌어있었다. vscode 의 단축키 ctrl + shift + p 로 메뉴 검색을 열어서 Open Settings (JSON) 을 열어준다. ctrl + f로 formatter 라고 검색해보면 "editor.defaultFormatter": "esbenp.prettier-vscode", 이렇게 eslint 가 아닌 prettier 로 설정되어 있음을 알 수 있다. 그 부분을 아래와 같이 eslint 로 변경해주면, 성공적으로 원하던 부분에서 개행이 된다. "editor.. 2021. 12. 25.
클린 소프트웨어 https://ridibooks.com/books/852000731?_s=search&_q=%ED%81%B4%EB%A6%B0%EC%86%8C%ED%94%84%ED%8A%B8%EC%9B%A8%EC%96%B4&_rdt_sid=search&_rdt_idx=0 클린 소프트웨어 소프트웨어 개발을 위한 사려 깊은 조언으로 가득한 책!『클린 코드』를 비롯한 베스트셀러 저자이자 소프트웨어 개발 전문가로 저명한 로버트 C. 마틴은 이 책을 통해 소프트웨어 개발자, 프로 ridibooks.com 클린 시리즈의 책을 알게 된 것은 ‘클린 코드’라는 책이 먼저였다. 개발자의 필독서라나? 그러다가 우연한 계기로 클린 소프트웨어라는 책도 있다는걸 알게 되었고, 최근 구매하여 보기 시작했다. 먼저, 읽고 싶었던 클린 코드도 읽기가.. 2021. 12. 20.
[ASP.NET] Entity Framework Core Entity Framework core 데이터 연동방식을 두가지로 제공한다. 1. Code-First 방식: 코드 작성 우선주의 마이그레이션 : 미리 작성된 코드로 데이터베이스에 테이블과 컬럼을 생성하는 방식 2. Database-First 방식: 데이터베이서 작업 우선주의 모든 테이블과 컬럼을 데이터베이스에서 테이블과 컬럼을 우선 생성한다. Entity Data Modeling : 코드를 손쉽게 작성할 수 있도록 도와준다. 먼저 Code-First 방식으로 진행해보기로 한다. Code First 방식 이전 게시글에서 작성한 프로젝트를 열어서 그중 DataModels/User.cs 파일을 열고, DataAnnotations 를 추가하고 , 어노테이션을 작성한다. [Key, StringLength(50),.. 2021. 12. 13.
[네트워크 관리사 2급 실기] 라우터 문제 정리 네트워크 관리사 2급 실기 문제 유형 및 배점은 다음과 같다. 1번. 케이블링 1문제 * 6.5점 2~9번. 에뮬레이터를 이용한 윈도우 설정 문제 8문제 * 5.5점 10~11번. 리눅스 2문제 * 5.5점 12~15번. 단답형 네트워크 문제 4문제 * 5.5점 1~3번. 라우터 문제 ( 현재 페이지 ! ) 3문제 * 5.5점 라우터 문제를 정리한 기념으로 포스팅을 한다. 15번 이후에 새로 1,2,3번 문제로 진행되므로 시험 순서상으로는 마지막에 해당된다! 정리 순서는 다음과 같다. interface 문제 show (확인) 문제 line 문제 그 외 (ip, hostname) 1. interface 문제 @ serial 2/0에 frame-relay방식으로 캡슐화 > en > conf t > inter.. 2021. 12. 10.
[vue] 정리 (최종 업데이트:2021-12-21) 최솔이의 작성 요령 개념 개념 ? 명령어 $ npm ... 주석 // 플러그인, 팁 * 주제별로 언급 @ 2021-12-07 VUE CLI / VUE 파일의 구성 요소 3가지 CLI ? Command-Line Interface 를 의미한다. 터미널을 통해 프로젝트를 손쉽게 시작할 수 있도록 도와준다. $ npm install -g @vue/cli // npm 이라는 명령어를 통해 vue cli를 전역(-g)에 설치해준다 * vue cli 공식 사이트 https://cli.vuejs.org/ $ vue create hello-world // 간단하게 프로젝트를 생성 할 수 있다. 강의 내에서 간단한 프로젝트 생성은 건너 뛰고 lint ? 코드 작성의 규칙을 정함 eslint , rules 도 마찬가지 pu.. 2021. 12. 7.
[ASP.NET] 개요 / MVC 패턴 / 의존성 주입 패턴 닷넷 코어는 패턴 프로그래밍에 최적화 되어있다. 패턴 ? 사용자에게 보다 나은 서비스를 제공 프로그램 개발 ? 테스트와 유지보수가 쉬워야 한다. 애플리케이션의 존재 목적 ? 사용자를 만족시키는것 닷넷코어는 아래 2가지를 사용한다 MVC 패턴 (Model-View-Controller) 의존성 주입 패턴 (Dependency Injection) 2021-12-07 MVC 패턴(Model-View-Controller) MVC 프로젝트 생성 C - MembershipController 컨트롤러 폴더에 추가 public IActionResult Login(LoginInfo login) {} 생성 내용에는 if문 내부에서 ModelState.IsValid 를 확인 if문으로 ID, PW가 일치하는지 확인하고 일치하.. 2021. 12. 7.
해리포터 미나리마 에디션 (마법사의돌, 비밀의방) 나는 해리포터 두 번째 시리즈인 비밀의 방이 출간될 때부터 전시리즈를 출간일에 구매해온 해리포터 덕후다. 매해 출간 전부터 용돈을 모았고, 용돈이 부족할땐 작디작은 학교 앞 서점에서 카운터에 계신 사장님의 눈치를 봐가며 읽곤 했다. 놀이동산에 관심도 없었지만 오사카 살면서 유니버셜 스튜디오 재팬을 가고 싶은 이유가 있었다면 해리포터 단 하나만이 목적이라고 해도 과언이 아닐정도.. 대학 다닐 땐 전권을 가져가서 방학 땐 하루에도 몇 시간씩 침대에 누워 다시 읽곤 했다. 그리고 요 몇 년간 ebook만 읽게 되면서 ebook으로도 전권 소장 중이다...ㅋㅋ 서론은 이만하고... 작년부터 출간되기 시작한 해리포터 미나리마 에디션 구매 후기를 작성해보고자 한다. 비밀의방 미나리마 에디션 출간일이 10월 26일이.. 2021. 11. 22.
[React] 컴포넌트간 통신 / Context API / provider / consumer / useContext 기존 구린 방법 1. 하위 컴포넌트 변경하기 (A의 버튼을 눌러서 B, C, D를 거쳐 E에 있는 값을 변경) 2. 상위 컴포넌트 변경하기 (E의 버튼을 눌러 역으로 D,C,B 를 거쳐 A에 있는 값을 변경) 각 함수들에 props를 인자로 받아서, B,C,D,E로 넘겨주어야 했다. 이문제를 해결하기 위해 useContext를 사용하기로 했다. 1. 하위 컴포넌트 전체에 데이터를 공유하는 방법 데이터를 set 하는 놈 = 가장 상위 컴포넌트 => provider 데이터를 get 하는 놈 = 모든 하위 컴포넌트에서 접근 가능 1) consumer import PersonContext from "../contexts/PersonContext"; export default function Example1() .. 2021. 11. 16.
네트워크 관리사 2급 필기 합격 수기 지난 11월 14일 일요일 한국정보통신자격협회 주최의 네트워크 관리사 2급 필기 시험을 응시했다 시험 장소는 8일 월요일이 되어서야 발표가 났고, 다행히(?) 서울의 중심지역인 선린 인터넷 고등학교였다. 어떤 후기에서 보니 건대였다고 해서 조금 걱정했는데 안심이었다. 시험 과목 네트워크관리사 2급 필기 시험은 아래 네 과목으로 구성되어있다. 1. 네트워크 관리 일반 2. TCP/IP 3. NOS 4. 네트워크 운용기기 공부 기간 & 공부 방법 이전 SQLD 합격 수기에서도 작성했지만.. 나는 이론서를 굉장히 좋아한다. 책장 채우기도 꽤 좋아해서 컴퓨터, 개발 관련 서적이 아니더라도 책장을 채우며 만족감을 느낀다. (다 읽는다고는 안했다 ㅎ) 추천도서는 SQLD와 마찬가지로 영진닷컴의 이기적 네트워크관리사.. 2021. 11. 16.
반응형

티스토리툴바