주말에 스파오닷컴의 한정수량 물품을 살려구 00시를 기다리던중에 카페 날웃게해에서 브레이브걸스 유정양의 생일카페가 4월30~5월 3일까지 한다는 소식을 접하고 오늘 급하게 방문하였습니다. 

날씨가 너무 좋았던 오전에 오픈시간에 맞춰갔는데, 6~7분정도 기다리고 계셨던거같네요.

각 메뉴별로 특전내용이 틀리니 확인해서 메뉴를 시키는게 좋다. 마카롱이나 스폐셜 메뉴같은경우 수량이 한정되어 있으니 참고 바람.

유정이 시켰다던 초코라떼와 핑크레몬에이드를 시켰다. 이 곳 카페에 음료나 디저트류가 괜찮으니 한번 정도 방문해서 먹어보는걸 추천한다.

카페 사장님 말로 유정양이 메니저랑 잠깐 들렀다고 하는데 아마도 이 의자를 이용하셨나봄. 젊은 사장님께서 같이 찍은 인증샷을 보여주셨는데 매우 부러웠다. ㅎㅎㅎ

지난번 유나생일 카페행사때는 사람이 많다보니 2층을 둘러 보지 않고 바로 나갔는데, 오늘은 여유있게 카페를 구경할 수 있었다.

2층은 벽면에 사진으로 장식되어 있다. 2층은 음료나 취식이 불가능하다. 사진은 상당히 많이 전시되어 있었다. 

마카롱을 자주 즐겨먹진않지만, 적당하게 달고 맛있었다.  

아침에 컴퓨터를 대기모드로 하고 일어났는데, 갑자기 인터넷이 안되었다. 

컴퓨터 작업표시줄 > 네트워크아이콘 오른쪽마우스 >네트워크 및 인터넷 설정 열기 선택한다.

왼쪽메뉴에서 프록시를 선택한다. 

수동 프록시 설정이 그림과 같이 켜져 있다면, 프록시 서버 사용 켬을 눌러서 끈다.

프록시 서버 사용이 꺼진걸 확인하고 인터넷을 여부를 다시 확인한다.

vue create "프로젝트명"  프로젝트를 생성한다.

아래에 해당하는 라이브러리를 설치한다.

yarn add  @fortawesome/vue-fontawesome@prerelease

yarn add  @fortawesome/fontawesome-svg-core

yarn add  @fortawesome/free-solid-svg-icons

yarn add @fortawesome/free-regular-svg-icons

yarn add @fortawesome/free-brands-svg-icons

모바일웹에서 공유기능에 대한 요청이 와서 해당 기능을 구현하기 위해서 내용을 정리해본다. 

navigator.share() 메서드는 디바이스에 네이티브 공유하기 기능을 작동시킨다. 

Web Share API 가 지원되지 않는 환경일 경우 메소드의 결과는 undefined 이다.

share메서드의 파라메터 구성은 아래와 같다.

title : 공유될 제목을 나타낸다.

text: 공유될 본문을 나타낸다.

url : 공유될 URL을 나타낸다.

<script type="text/javascript">    
  
	 var btnShare = document.getElementById("btnShare");
		 btnShare.addEventListener("click", function(){
		
	   var shareTitle = "공유하기 기능 테스트";
		var shareText = '공유하기 기능 입니다.';
		var contentURL = "/share/shareUrl";
		var URLPreFix = "";
		
		URLPreFix = URLPreFix + "//" + location.host;
		
		var shareURL = URLPreFix + contentURL;
		
		if (navigator.share){
			  navigator.share({
			      title: shareTitle,
			      text: shareText,
			      url: shareURL,
			  })
		    .then(() => console.log('Successful share'))
		    .catch((error) => console.log('Error sharing', error));
		}else{
			alert("공유하기를 지원하지 않는 환경입니다.");
		}
	});
		
</script>

안드로이드폰에서 실행한 화면 예제)

참고 포스팅 글들 

developer.mozilla.org/ko/docs/Web/API/Navigator/share

ui.toast.com/weekly-pick/ko_20190618

오프라인에서 인터넷이 안되므로 인터넷이 되는 환경에서 프로젝트를 생성한 다음 오프라인으로 옮겨야 된다. 

온라인 환경에서 해야 될 것들 

1. vue-cli 명령을 이용하여 프로젝트 생성

2. 필요한 라이브러리를 설치한다. npm 명령어 또는 yarn 

3. 프로젝트경로로 가서. yarnrc생성

4.. yarnrc에

yarn-offline-mirror "./npm-packages-offline"
yarn-offline-mirror-pruning true

5. node_modules 와 yarn.lock 파일을 삭제한다.

6. 터미널을 실행하여 아래와 같은 명령어를 실행한다. 

yarn cache clean
yarn install

7. yarn install 명령어를 실행하면 yarn.lock 파일과 node_modules 폴더가 다시 생긴다. 

node_modules 파일은 삭제하고 압축해서 폴더를 오프라인 환경으로 옮길 준비를 한다. (오프라인 환경으로 옮긴 다음 yarn install 명령어를 다시 실행하면 node_mnodules 파일이 다시 생기므로 삭제하고 옮긴다.)

오프라인  환경에서 해야될것들 

1. 적당한 위치에 폴더를 옮기고 압축을 해제한다.

2. 터미널에서 아래와 같이 명령어를 입력하면  npm-packages-offline 폴더에 압축된 라이브러리를 참조하여 node_modules 폴더를 생성한다.

yarn install --offline

참고

musma.github.io/2019/08/23/nodejs-offline-deployment.html

velog.io/@hayeon1234/%EC%98%A4%ED%94%84%EB%9D%BC%EC%9D%B8%EC%97%90%EC%84%9C-React-%ED%99%98%EA%B2%BD-%EB%A7%8C%EB%93%A4%EA%B8%B0

Eclipse에서  Unresolved compilation problem 해당 에러가 발생하는 경우 

톰켓에 서버를 선택하고 오른쪽 마우스 버튼 메뉴에서 Project Clean을 선택하고 다시 빌드를 한 다음 톰캣을 재구동 해본다.

Vue3 버전으로 버전을 상향하고 실습을 하고 있는데 Vue devtoolsrk Vue.js를 인식하지 못해 확장 플러그인이 정상 동작하지 않았다.

chrome.google.com/webstore/category/extensions?hl=ko

크롬 웹스토어를 접속하여  검색어 항목에 vue3 devtools를 검색하면 확장 프로그램 목록이 나타난다.

이 글을 쓰는 현재 Vue3 devtools 버전은 6.0.0 beta 버전이다. 해당 버전을 다시 설치하고 이전 설치된 버전은 삭제한다. 

플러그인 설치 후 크롬브라우저를 재 실행하고 Vue.js devtools 가 정상 작동하는지 확인한다.

vue create 명령어 실행중 self signed certificate vue-cli self signed certificate in certificate chain

yarn config set "strict-ssl" false   명령어를 실행 한뒤 cmd 창을 닫고 다시 연다. 

vue create "프로젝트명" 실행한다.