본문 바로가기
반응형

전체 글374

vuepress 구글 서치 콘솔 등록하기 - 구글검색 최적화(SEO) [ 목차 ] 내 사이트가 Netlify에 배포된 이후에도 아직 검색이 안되고 있습니다. 주소가 아니면 아직 접근할 방법이 없네요. 구글에 노출시키는 작업이 필요합니다. 이걸 설정해주는게 구글 서치 콘솔(Google Search Console)입니다. 여기에 등록해주면 구글에서 검색도 되고, 그 외에 모니터링도 가능해집니다. 오늘은 서치 콘솔에 등록하고, sitemap.xml, robots.txt 파일을 적용하는 방법에 대해 알아보겠습니다. 1.구글 서치콘솔 등록 구글 서치콘솔에 로그인한 후 속성 추가를 해 줍니다. [ 속성 유형 선택 ] 다음으로 속성 유형에서 "URL 접두어" 부분으로 가서 추가하고자 하는 URL을 적어주고 "계속" 을 클릭해줍니다. [ 소유권 확인 ] 다음으로 소유권 확인창이 뜹니다... 2023. 7. 12.
vuepress 1.9.9 버전 시작하기 (태그 기능 달기) Node 18버전에서 vuepress 1.9.9 버전 설치에 오류가 있어서 포기했다가, 다시 Node 16버전으로 낮춰서 설치했습니다. 아직 Beta버전인 2.0.0 보다 오류가 적은 것 같습니다. 설치하니 기본적으로 검색 툴이 활성화되고, Vue 컴포넌트 추가도 components 폴더에 만드니 별다른 설정없이 인식이 됩니다. 그리고 무엇보다도 태그 요소 추가가 너무 쉽게 진행됩니다. Vuepress2로 하려고 시도하며 공부해서인지 금방금방 작성이 되네요. 다시 Vuepress 1으로 재작성해야겠습니다...ㅠㅠ 1. 설치 npm init npm i -D vuepress@next 2. ./docs/README.md 파일 생성 ### Hello Vuepress 3. ./gitignore 파일 생성 node.. 2023. 7. 12.
Vuepress2에서 vue 컴포넌트 만들어서 등록/사용하기 1. 플러그인 추가 npm i -D @vuepress/plugin-register-components@next 2. .vuepress/config.js파일에 플러그인 추가 import { registerComponentsPlugin } from '@vuepress/plugin-register-components' import { getDirname, path } from '@vuepress/utils' // const __dirname = getDirname(import.meta.url) // 인식 오류시 사용 export default { title:"Hello, Vuepress", plugins: [ registerComponentsPlugin({ componentsDir: path.resolve(_.. 2023. 7. 6.
Vuepress2 정적 사이트 생성기 시작하기 [ 목차 ] 블로그 같은걸 만들다보니 순수 Vue.js보다는 SSR 또는 정적 사이트 생성기 SSG가 필요하게 되었습니다. React에는 유명한 Gatsby가, 그 이전에 Ruby에는 Jekyll 이라는 정적 사이트가 있었는데, Vue에는 마땅한게 없나 살펴보던 중 Vuepress 라는 걸 알게되었습니다. 오늘은 Vuepress를 이용하여 간단한 블로그를 생성해보겠습니다. Vuepress2 Home | VuePress v2.vuepress.vuejs.org 1. 설치 설치는 npm으로 간단히 아래와 같이 진행하면 됩니다. npm init npm install -D vuepress@next 2. 구성 처음 라이브러리를 설치하면 위 이미지처럼 아무것도 나타나지 않습니다. 여기에 몇가지 수동으로 폴더 및 파일.. 2023. 7. 4.
자바스크립트 slice, splice ,split의 활용과 차이점 오늘은 자바스크립트에서 자르고 나누는 함수지만 헷갈리는 세가지 함수, slice, splice, split 에대해 알아보도록 하겠습니다. [ 목차 ] 1. slice() slice는 원하는 부분을 복사하여 새로운 배열로 리턴합니다. 원본을 변경시키지 않습니다. //slice(시작점, 끝점) ...0부터 시작 let my_array=['test1', 'test2','test3','test4']; second_array=my_array.slice(2,3) // output:['test3','test4'] 2. splice() splice는 원본이 수정됩니다. //splice(시작점, 잘라낼 갯수, 추가할 요소,,,n개) // 요소 제거 let my_array=['test1', 'test2','test3','.. 2023. 6. 29.
Nuxt 프로젝트 Netlify에 배포하기 / 외부 도메인 적용하기 오늘은 Nuxt 프로젝트를 Netlify에 배포해보도록 하겠습니다. 동시에, 도메인 하나를 구매해서 적용해보겠습니다. [ 목차 ] 1. 도메인 구매 (hosting.kr) 저는 Hosting.KR이란 곳에서 도메인을 구매했습니다. 아래와 같이 이벤트중인 도메인 종류들도 있는데, 중간 즈음에 "도메인 가격안내"를 클릭하면 이벤트중인 싸고 좋은 것들도 찾으실 수 있습니다. 저는 likeapianist.blog라는 이름으로 블로그를 하나 만들어보겠습니다. 2. Netlify-Gitlap 연동 배포 사전에 Nuxt 프로젝트를 gitlap(또는 github)에 배포를 해 놓습니다. 어느정도 배포가 가능한 모양새는 갖추고 있어야겠죠? 본인의 깃 저장소를 고르고... Vue 프로젝트의 빌드는 "npm run buil.. 2023. 6. 23.
자바스크립트 전개 연산자 (...) 전개연산자는 ES6에서 추가된 기능으로 배열이나 객체를 분해된 값으로 전달하는 기능입니다. 배열 등 모든 순환 가능한 것들은 펼쳐서 가져올 수 있습니다. 1. 배열 예 const arr1 = ['a', 'b', 'b']; const arr2 = ['d', 'e', 'f']; const arr3 = ['g', 'h', 'i']; const sum_array = [...arr1, ...arr2, ...arr3]; console.log(sum_array); // ['a', 'b', 'b', 'd', 'e', 'f', 'g', 'h', 'i'] 2. 객체배열 예 const obj_array=[ { name: "one", age: 1, }, { name: "two", age: 2, }, { name: "three.. 2023. 6. 22.
자바스크립트 화살표 함수 (=>) 오늘은 자바스크립트 ES6에서 추가된 주요 기능 중 화살표함수( => )에 대해 알아보겠습니다. [ 목차 ] 1. 화살표 함수 기존의 function으로 함수를 표현하는 방식을 좀 더 간결하게 표현하기 위해 화살표( => ) 함수가 도입되었습니다. 아래의 두 함수는 모두 동일한 역할을 하는 함수입니다. const test1 = function(a,b){ return a+b; } const test2 = (a,b) => { return a+b; }; const test3 = (a,b) => a+b; 2. 화살표 함수 주의점(this) 일반적인 자바스크립트 함수에서의 this는 - 전역 객체 - 메소드 호출시 호출한 해당 객체 를 나타냅니다. // 일반 함수 const obj1 = { name: '홍길동',.. 2023. 6. 22.
자바스크립트 filter 사용법 자바스크립트 filter 메소드에 대해 알아보겠습니다. Filter 메소드는 배열 내부를 순환하면서 특정 조건에 부합하는 요소들을 새로운 배열에 담아 반환합니다. 1. 기본사용법 result = my_array.filter (a => { return [조건]; }); const my_array = [1,2,3,4,5,6,7,8,9,10] const result = my_array.filter(a => { return a % 2 == 0; // a중 2로 나눈 나머지가 0(즉, 짝수)인 요소 }); console.log(result); // [ 2, 4, 6, 8, 10 ] 2. 객체 다루기 const my_array = [ {name:'홍길동', age:28}, {name:'이순신', age:37}, {.. 2023. 6. 20.
버크셔 해서웨이(Birkshire Hathaway, BRKa) 종목분석 버크셔 해서웨이는 투자의 귀재 워렌 버핏이 이끄는 세계 최고의 투자회사입니다. 우리나라에서도 꽤나 유명한 회사인데요, 구글, 애플, 마이크로소프트 만큼은 아니지만 워렌버핏 회사 하면 대부분 고개를 끄덕입니다. 오늘은 이 버크셔 해서웨이에 대해 알아보겠습니다. [ 목차 ] 비즈니스 버크셔 해서웨이는 1839년 섬유 제조회사로 시작했습니다. 1962년 워렌버핏이 주식매입을 통해 경영권을 얻게되었고, 그후 다양한 업종의 기업과 M&A를 통해 지금의 다국적 지주회사로 성장하게 되었습니다. 개요버크셔 해서웨이는 미국의 지주회사로서 보험업과 제조업 등 다양한 사업을 하고 있지만, 대부분의 매출은 금융업에서 나오고 있습니다. 특히 자회사인 BNGO(Berkshire Growth)라는 헤지펀드 운용사의 수익률이 매우 .. 2023. 6. 19.
반응형