Vue.js 3 의 기본적인 사용법을 설명합니다. Vue2 에서 Options API를 통해 개발했다면, Vue3 에서는 Composion API로 개발을 하게 됩니다. 보통, Composion API로 만들게 되면, Setup() 함수에 구현을 하는데요, 여기서는 Setup()함수를 사용하지 않습니다. 대신, script 태그 선언시에 setup 옵션을 추가합니다. 이렇게 하면 코드를 더욱 간결하게 작성할 수 있습니다.

 

  • 개발환경 구성과 프로젝트 생성 (Hello World)
  • 폴더와 파일에 대한 설명
  • 뷰 데이터와 함수
  • 데이터 바인딩
  • 이벤트
  • 데이터 양방향 바인딩
  • Computed 속성
  • Watch 속성
  • 클래스&스타일 바인딩
  • v-if와 v-show
  • v-for 리스트렌더링
  • 여러개의 Vue 인스턴스 사용하기
  • Vue 컴포넌트
  • 뷰 라우터 ( yarn add "vue-router@^4.0.0" )
  • 싱글 파일 콤포넌트
  • 자식 컴포넌트에 데이터 보내기
  • 부모 컴포넌트로 데이터 보내기
  • 슬롯
  • 뷰 인스턴스 라이프사이클
  • 미니 프로젝트 (단어장 1)
  • 미니 프로젝트 (단어장 2)
  • Context

 

요즘, Django 와 jQuery 를 이용해서 회사에서 사용할 시스템관리 프로그램을 하나 만들고 있습니다. 처음이라서 적응하는데 시간이 좀 걸리고 있긴 하지만, 웹프로그래밍에 상당한 생산성을 향상시켜주는 것 같더군요. 특히, jQuery 에 더 큰 점수를 주고 싶습니다.

다른 Javascript 라이브러리를 제대로 사용해보지는 못했지만, DOM을 다루거나, AJAX 를 적용하는데 무척이나 쉽고 간결하게 처리할 수 있었습니다. 이제 Javascript 를 다루는 것이 재미있어지네요. 그 전까지는 정말 Javascript 얘기만 하면 너무 힘들었거든요.

RIA를 위해서 Silverlight 나 FLEX 까지 고려했었는데, 일단 간단한 프로그램은 jQuery를 이용하여 AJAX로 구현해야겠습니다. 한가지 더, 파이어폭스의 애드인 프로그램인 파이어버그 또한 웹프로그래밍시 디버그할 때에 반드시 필요하더군요.

며칠동안 여러 자바스크립트 라이브러리를 이용해서 다이얼로그 박스를 만들어서 처리하려고 하였으나, 만족으러운 결과를 얻지 못해서, 결국, 새로운 윈도우를 띄우기로 결정했다.

브라우저에서 새로운 창을 띄우려면 window.open(URL, Name, Options) 함수를 이용해야 하는데, 여기에서 두번째 인자인 Name 을 쓸 때 주의할 것이 있다. 주의해야 할 점은 Name 을 쓸 때 절대로 공백문자를 넣어서는 안된다는 것이다. 파이어폭스, 크롬 등에서는 문제가 없으나 IE에서는 Name 에 공백문자가 들어가면 윈도우가 나타나지 않기 때문이다. 이것은 IE의 버그는 아니고, 표준을 잘 지키는 것뿐이다.

http://developer.mozilla.org/index.php?title=En/DOM/Window.open&highlight=window.open 에 가서 확인해보면 알 수 있다.

위에서 보이듯이 This string parameter should not contain any blank space. 라는 구문이 보이는데, 해석을 해보면 "이 문자열 파라미터는 절대로 공백을 포함해서는 안된다." 라고 명시되어 있다.

그러므로, 앞으로는 반드시 window.open() 함수의 두번째 인자에 공백이 들어가지 않도록 주의해서 사용해야 한다. 이것이 오늘의 핵심 내용이다. 아마도 많은 사람들이 알고 있을거라 생각하지만, 혹시라도 모르는 사람이 나처럼 헛고생하지 않기를 바랄뿐이다.

'ETC > IT' 카테고리의 다른 글

아웃룩 2007 로딩시 먹통 되는 현상  (0) 2009.06.17
테이블위로 마우스 커서 이동시 색깔 변경하기  (0) 2009.06.15
jQeury 정말 좋네요. *^^*  (0) 2009.06.03
서버 벤더별 RAID 비교  (0) 2009.02.18
.NET을 다시 알다  (0) 2008.12.08

+ Recent posts