본문 바로가기
728x90
반응형

Study25

vue 설치부터 vuetify 설치까지 우선은 vue Install 부터. 설치 자체는 무척 간단하게 되어 있습니다만. Yarn 이나 npm 으로 설치를 진행 하려면 우선적으로 node 가 깔려 있을 필요가 있습니다. 가장 손쉽게 접근하는 방법은 CDN을 활용하는 방법입니다. 연습만 하는 것이라면 jsfiddle이나 codepen 에서도 연습이 가능합니다. CDN을 사용하면 사용해 보는데는 문제가 없지만, 전 프로젝트에 사용해야 하는 관계로 설치버전으로 진행했습니다. 어디에서라도 참조하여 프로젝트를 생성시킬 수 있도록 '-g' 옵션을 활용합니다. npm install -g @vue/cli 설치 후에는 제대로 깔렸는지, 버전 확인을 해준뒤 프로젝트를 생성합니다. vue -V vue create [project-name] 하나하나 코드를 치기가 .. 2018. 8. 21.
vue.js 입문자용 동영상 강좌 vuetify를 업무에서 사용하기 위해 vue.js를 공부해 보고 있는 마크업 엔지니어의 일종의 학습일지입니다. 확실히 생각보다는 접근하기 쉬운 구조로 되어 있다는 것을 체감하고 있습니다. 따라 해보면서 익히는 것도 중요하지만, 남이 작업하는 것을 보면 더 기억하기가 수월해지는 느낌을 받았습니다. 그래서 동영상을 통한 학습법이 통용되고 있는 거겠죠. 아무래도 입문자다 보니 가장 대표적으로 많이 사용 중인 구문을 사용한 동영상이 참고가 된 것 같습니다. 저와 같은 입문자에게 도움이 될 것 같아 참고했던 곳을 모아 봤습니다.. 무료 강좌는 역시 영어로 된 자료가 많습니다. 저도 영어를 못 알아듣지만 코드만 보면 되는 거라 부담가지실 필요 없을 것 같습니다. 1. https://vuehero.com/cours.. 2018. 8. 19.
vuetify를 사용하기 위해 vue.js를 알아가는 중 어쨌건 시작을 했으니 익히긴 해야겠는데 아무래도 (개인적으로) 프레임워크부터 발을 들이는 건 아닌 것 같아서 vue 관련 서적을 찾아봤지만, 초급, 입문자용 이외에는 딱히 없었습니다. 소문만큼이나 공식 사이트의 가이드가 상당히 잘 되어있다는 증거일지도 모르겠습니다. 해서 그쪽을 내리읽고 있는 중입니다. 한번 책 읽어 보면서 따라 해 봤다고 다 할 줄 알 정도의 천재가 아닌지라 처음부터 다시 읽기 시작했습니다. 어떤 식으로 움직이는 것인지 맛이라도 보자는 취지에서 읽어봤다면 이번엔 일을 해야 하는 관계로 이런저런 조사를 하면서 좀 더 웹을 참고하며 공부 하고 있는 중입니다. 이미 사용하기로 되어 있는 vuetify라는 프레임워크가 정해져 있지만, 시간은 좀 걸리더라도 우선은 vue.js의 기본문법을 알아두.. 2018. 8. 18.
한권의 책이 주는 느낌은 어떤 것일까.. - 책은 도끼다 박웅현씨의 책을 또 한권 읽게 되었다. '책은 도끼다 - 인문학 강독회' 이전 '인문학으로 뭘 할까?'를 읽고 참 많은 것을 느끼고 생각해 볼 수 있는 시간을 가지게 되었던 만큼 이 책에도 많은 기대를 하고 있었던 것이 솔직한 심정이었고, 그 기대는 그에 충분한 만족감을 가져다 주었다. 2011/12/23 - [book] - 인문학으로 뭘 할까? - 인문학으로 광고하다. 빨리, 많은 책을 읽는 것이 중요한 것이 아니라 한권, 한줄을 정독하며 그 의미를 되새겨 보며 읽는 것에 대한 저자 나름의 방식을 모두와 공유하고자 하는 취지에서 만들어진 강독회에서 다루어진 내용이 한권의 책으로 나온것이다. 책을 다 읽고 나서 느낀점은 이 강독회에 참석할 수 없었던 것이 내심 아쉽다는 것이었다. 책을 읽는다는 행위가 언.. 2012. 5. 5.
디퍼런트(Different) 디퍼런트 문영미 저/박세연 역 디퍼런트.... '넘버원을 넘어 온리원으로' 카피가 주는 느낌이 남다르달까. 누구나가 새로운, 남들이 생각지도 못하는 기발한 아이디어로 세상에 이름을 남기고자 하는 꿈을 한번씩은 꾸리라 생각된다. 하지만, 수백이면 수백, 수천이면 수천. 그렇게 생각하는 이들중에서 과연 몇%가 이름을 남길 수 있을까? 남들이 'YES'라 할때 'NO'라 하고 남들이 'NO'라 할때 'YES'라 할 줄 아는 능력. 이런것을 뭐라고 해야 할까? 선견지명? 무대포? 신념? 그것이 무엇이 되었던 간에... 남들과 똑같이 해서는 그 분야에서 성공할 수 없다는 것은 자명한 사실. 성공하기 위해서는 차별화를 시켜야 한다는것이 가장 큰 요점이라는 느낌이 든다. 그것도 단순히 차별화를 시키는 것이 아닌, 독.. 2011. 6. 29.
デザインの輪郭 일단, 난 저자의 작품을 하나도 모른다. 이 책은 단지 제목에 끌려서 사게 된 책으로 무려 2년여전에 사두곤 이제사 다 읽어 볼 수 있었다. 읽다 보니 저자가 생각하고 있는 디자인에 대한 철학을 조금은 옅볼 수 있는 좋은 기회가 되었다고 생각된다. 누가 어떤 생각을 가지고 작업에 임하고 있는지... 이러한 사상은 늘 재미있다고 느껴지는 부분이다. 저자는 물건을 디자인하는 것이 아닌 그 주변을 디자인한다고 할 수 있겠다. 사람은 누구나 무의식적으로 어떠한 행동을 한다. 자신이 가장 취하기 편한 자세로 가장적은 동작으로 만족감을 느낄 수 있도로. 저자는 이러한 무의식적인 움직임에 기초하여 그 움직임선상에서 이루어질수 있는 것들을 디자인하고 있다. 내가 무엇을 하고 있는지, 무엇을 할지, 사람은 누구나 생각을.. 2011. 6. 17.
심리를 꿰뚫는 UX디자인 심리를 꿰뚫는 UX 디자인 '심리를 꿰뚫는 UX디자인'을 읽고. 무척얇은 책이다. 1cm정도? 심리를 꿰뚫는데 이정도로 가능한가? 라는 별 쓸데없는 생각을 하면서도 구입을 하게 된것은 나름 UX라는 장르에 관심을 가지고 있기 때문에 무의식적으로 구입하게 된것은 아닐런지 모르겠다. 무의식... 그렇다. 이 책의 주된 내용은 인간의 뇌가 가져다 주는 무의식의 세계를 알기 쉽게 풀이해주는데 있다고 본다. 자신은 이성적이며 충분한 교육을 받은 사람으로서 단순히 무의식에 지배당하는 일은 없을 것이라 여기지만 실제로 그렇지 못하다는 것들을 과거 이루어진바 있는 실험들을 근거로 풀이하고 있다. 사람의 뇌가 가지고 있는 기능들에 대하여 서술하면서 어떻게 웹과 연결시키면 좋을지에 대해서도 예를 들며 알려준다. 어떤 서비.. 2011. 5. 29.
스매싱 북 스매싱 북 - 스매싱 미디어 지음, 웹액츄얼리코리아 옮김/웹액츄얼리코리아(주) 스매싱북을 읽었다. 관심이 가던 책이었으나 번역본이 나와있는 줄은 몰랐었는데 저번달 한국에 갔을때 잠깐 읽어보고 구매했었다. 출퇴근길과 짬날때마다 읽었고 내용은 마음에 들었다. 웹과 관련된 전반적인 내용을 다루고 있으며 스매싱이 태어나게된 유래도 알게 되어 나름 재미있게 책을 읽어 내려갔다. 웹과 관련된 내용들을 전체적으로 알기 쉽게 그리고 필요한 부분만을 추려서 제공한 책이라는 느낌을 많이 받을수 있었고 어떤 영감을 얻는다기 보다는 작업을 하는데 있어 효율적으로 고려해야 할 사항들에 대한 가이드라고 할 수 있을것 같다. 전체적으로 읽어보니 개인적으로 웹디자이너가 주 타겟이라 생각 되었지만 퍼블리셔나 기획자가 읽어도 도움이 될.. 2011. 5. 10.
검색패턴을 읽고 검색 패턴 - 피터 모빌 & 제프 칼렌더 지음, 김소영 옮김, 윤종완 감수/한빛미디어 얼마전에 읽은 책중의 한권으로 Yahoo, bing, Google등 검색과 관련된 지식을 유탁하게 만들 수 있는 책이라 생각된다. 몇년전과 달리 요새는 검색이 너무 간단하게 이루어지고 있는 것이 사실이라 생각된다. 각가의 검색엔진들이 제공하고 있는 고급검색을 위한 옵션을 몰라도 대충 가능해지기도 했으니.. 그도 그럴것이 거대 기업들이 검색엔진을 만들어내는데 투자하는 기술이 장난이 아니니까. 이 책은 검색의 여러가지면을 두루두루 다루고 있다. 우리가 알고자 하는 "그 무엇"을 보다 정확하게 찾아주고 "대안"을 제시해주기 위해 검색엔진에 여러가지 기술들이 제공 되고 있다는 것을 알게 되며 무의식속에서 움직이고 있는 사람들의.. 2011. 5. 6.
OGP(Open Graph Protocol)가 뭐지? 미리 말해두지만 OGP에 관한 상세정보는 http://ogp.me/ 라는 곳에서 확인해 볼 수 있으며 이곳의 글을 읽는다면 더이상 이 페이지를 읽을 필요 없다. SNS중에서도 특히 페이스북의 강세는 식을 줄 모르는것 같다는 생각이 계속 들고 있는데 여러모로 실험적이면서 재미있는 기능들을 계속해서 추가해가는 것을 보고 있노라면 그들의 열정과 아이디어의 산물들이 현시대 인터넷 업계의 흐름을 이끌어가고 있다는 생각이 들게끔 만들기 때문이다. 쓸데없는 각설은 여기까지만 하고 본론으로 넘어가서 이전 포스팅에서는 티스토리에 설치한 SNS에 관한 내용이었다면 이번에는 잠시 언급한바 있는 OGP에 관한 내용을 다루어 보고 싶다. 본인 역시 처음에는 어떤 효용가치가 있는지도 모르겠고, 좋다니까, 이게 뜬다니깐 하는 생각.. 2011. 5. 3.
SNS관련 버튼을 설치해봤다. 여기저기서 SNS(Social Networking Service)를 설치하고 있기에 본 블로그에도 설치해 보기로 했으며 몇가지 시행착오에 대한 메모를 겸한다. 페이스북 http://developers.facebook.com/docs/plugins/ ■ 첫관문은[##_article_rep_link_##] 티스토리에서 사용중인 블로그 기사 하나하나에 자동으로 추가 시키기 위한 부분을 검색해보니[##_article_rep_link_##]를 사용하라고 나와서 간단하게 적용성공. 자동생성시의 코드 "http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fstudy.may5.net&send=true... 수정후의 코드 http://www.facebook.com/pl.. 2011. 4. 29.
UX디자인 프로젝트 가이드 UX 디자인 프로젝트 가이드 UX라는 것은 뭘까? 늘상, 아니 UX라는 단어를 접하고 난 뒤 늘 생각해 봤었다. 그저 내가 하고 있는 디자인이라는 작업도 엄밀히 말하면 사용자의 경험향상을 위해, 좀더 나은 환경을 제공하기 위한 UX의 한 부분이라 생각하고 있었다. 물론 그 기여도나 방식은 틀릴지도 모르지만 생각이 틀린 것은 아니라 생각되며 비쥬얼 디자인과, 인터랙션디자인과의 차이에 대해 본서를 읽고 나서 어느정도 안개속에서 조금씩 길이 보이는 기분이 들었다. 디자이너라는 입장에서 업무를 진행하다보면 와이어프레임등 UX디자인에 대해 아련하게 감각적으로 체험을 하게 된다. 그리고 무엇인가 부족함이 있다는 것을 느끼기 시작한다. 그리고, 그 부족함에 대한 돌파구로서 UX에 대한 궁금점, 기대사항, 해보고 싶다.. 2011. 1. 2.
스마트폰사이트 제작관련 참고사이트 이번 스마트폰사이트 제작시에 참고한 사이트들. 실제로 이정도의 퀄리티까지는 끌어내진 못했지만. 짧은 기간에 많은 도움을 받은 곳들이라 메모용으로.. ■디자인참고 http://iphonedesignarchive.jp/ http://web.meet-i.com/?type=web http://www.ishowcase.jp/ http://www.forexpress.com/contents/index.php?ID=3324(주식관련) http://www.tappgala.com/ http://tapfancy.com/ http://www.youthedesigner.com/2010/03/10/29-sexy-iphone-app-designs/ http://www.mobileawesomeness.com/ http://cssip.. 2010. 12. 9.
IE가 싫어요! 특히 IE6이 싫은 개인적인 감정입니다만... 최근 IE로인한 문제점이 부각된 국제적인 사건이 바로 중국의 구글등 중국에 진출해 있는 국제적인 IT기업들에 대한 사이버공격소식이라고 생각됩니다. 중국의 정보차단의 일면을 본것 같습니다. 일설에 의하면 국제적으로 중국에 대한 좋지않은 기사들을 쓰고 있는 자들의 개인정보를 빼내기 위해서 Gmail등에 접근한것으로 보인다고 합니다. 물론 현재 중국에서는 그런일 없다고 말하고 있지만.. 현재 돌고 있는 정보에 의하면 IE전체 버전에 걸쳐 미수정된 부분을 공격하여 해킹을 시도한것으로 보인다고 합니다. 이는 Microsoft사도 인정하고 있는 부분이며 특히 XP에서 IE6를 사용하고 있는 유저는 그 위험성이 제일 높다고 하내요. 이거 한국에서 가장 많이 있는 케이스는.. 2010. 1. 18.
Multi Touch Apple의 iPod에서 시작된 User Interface/User Experiences의 변화는 iPhone의 보급과 더불어 터치스크린을 활성화시켰고 인터페이스의 발전에 꽤나 많은 기여를 했다고 개인적으로는 생각한다. 물론 기술이라는 것은 이전에도 존재하고 있었지만 그것을 실생활에 적응하는데는 그만큼의 "최적화" 작업이 필요한 만큼 그러한 면에서 보자면 적합한 예라고 생각된다. 영상에서는 화면터치에 의한 사운드의 변화를 보여주고 있다. 음악이라는 것이 전문적인 지식을 소유하고 공부를 한 사람들이 아닌 이렇게 손으로 만져가면서 시각적으로 움직임을 느끼면서 즐기고 공유할수 있는 시대가 온것 같다. 터치스크린을 이용한 인터페이스는 이러한 음악산업 뿐만이 아니라 게임산업에도 확실한 영향을 미치고 있다고 보인다.. 2009. 5. 13.
디자인 웹 네비게이션 (Designing Web Navigation) Designing Web Navigation - 제임스 콜백 지음, 김소영 옮김/한빛미디어 "디자인 웹 네비게이션"이라는 제목에서 볼 수 있듯이 네비게이션 설계에 관한 교과서적인 책이라는게 솔직하게 읽어본 감상이다. 예전에는 O'REILLY의 책은 왠지 프로그래머만이 보는 책이라는 이미지가 강했기에 볼 생각조차 하지 않았었는데 요새는 이 출판사의 책들의 중요성을 조금씩 이해하고 있는 중이다. 늦은 감이 있지만...늦었다고 생각할때가 가장 빠르다고 하는 것처럼... 네비게이션과 관련된 여러 지식과 방법을 400쪽이 넘는 꽤나 두꺼운 책으로 무겁다.... 이 책을 언제 다 읽어본담...이라는 생각을 하면서 읽기 시작했지만.. 웹 디자이너라면, 웹 기획자라면 이 한권은 꼭 읽어볼 가치가 있다고 생각된다. 스스.. 2009. 3. 25.
웹2.0 기획과 디자인 웹 2.0 기획과 디자인 - 노주환 지음/플루토 이 책은 현재 웹에 존재하고 있는 여러 기술과 지식, 이론들을 정리해 놓은 얇은 참고서라고 할 수 있겠다. 사이트에 사용되고 있는 기술의 명칭과 그 뒤에 있는 이론들에 관해서도 짧게기술하고 있다. 두껍지 않은 책이지만 그 내용은 한번쯤 읽어볼 가치가 있다고 본다. 기획서를 작성할때등 사이트를 구성할때 한번씩 훑어보는 것도 나쁘지 않을것 같은 책. 2009. 3. 25.
Graph Layout Interface 이러한 인터페이스는 외견상 보기에 좋다. 흥미롭다고 할까나. 클릭할때마다 보여지는 아기자기한 움직임과 사운드는 시각적으로 현재 "움직이고 있다"는 결과를 즉각적으로 보여주는 유용한 방법이다. 시각적으로 어디서부터 시작해서 현재 어느지점에 있는지를 한 화면에서 확인이 가능하다. 하지만... 결론적으로 말하자면 "시각적으로만 좋다"고 생각된다. 이유는 아직까지는 사람이 읽고 정보를 파악할수 있는 눈의 움직임이라는 것이 국가나 그 언어에 따라 틀리겠지만 왼쪽에서 오른쪽, 오른쪽에서 왼쪽, 위에서 아래의 순서로 정보를 얻고 있다고 생각되기 때문이다. 이러한 환경에서 시각적으로 "상하좌우"로 움직이는건 상당히 흥미롭지 않을 수 없지만 하나의 주체를 두고 사방으로 번저 나가는 정보의 연결은 클릭할 수록 늘어나는 정.. 2009. 3. 21.
What makes good software? 당신이 생각하고 있는 Good Software는? 사용하기 쉬울것. 심플할것 등등 길거리에서 찍은 이 영상은 정말로 "유저"들을 담고 있다. 그들이 생각하고 있는 좋은 소프트웨어에 대한 1분여의 짧은 동영상. 당신이 생각하는 "좋은 소프트웨어는?" 2009. 3. 18.
'웹 접근성'의 준수 솔직히 영상은 그렇다치고... 내용면에서는 필요한 내용이라고 본다. 일반적으로 웹을 사용하고 있는 사람들(마우스를 사용하고, 보고, 듣고)에게 있어서는 아무런 문제도 없지만 장애인들에게 있어서는 이 모든것이 제대로 이용되고 있지 않은 실정이다. 실제로 모든 유저를 만족시키면서 사이트를 구축한다는 것은 중요한 일이고 대단한 일이지만...그렇게 하기엔 현실적으로(?) 자금면, 시간적인 측면에서 무리가 있는 것도 현실이라고 본다. 그렇기 때문에 공공기관이외의 곳에서 실제로 장애인들을 위한 서비스가 이루어지고 있는 곳을 본적이 없는것 같다. 아니, 실제론 공공기관에서도 장애인들을 위한 서비스가 제대로 이루어지고 있는지도 잘 모르겠다. 웹으로 밥을 먹고사는 나로서도 다시한번 생각해봐야 할 문제라고 생각된다. 하다.. 2009. 3. 17.
사용자 경험에 미쳐라! 사용자 경험에 미쳐라! - 데이비드 베르바 외 지음, 김소영 옮김/한빛미디어 원제:SUBJECT TO CHANGE 음...공감하게 만드는 말이라고 할까나. 막말로 제대로 미치지 않고서야 어떻게 사용자가 뭘할지 무엇을 원하는지를 일일이 파악하고 연구하고 실험하고 조사하고 하겠는가. 자기가 하고 있는 일에 제대로 미쳐야 뭘 해도 제대로 하겠지. 한번 읽긴 했지만... 다시 한번 읽어보면서 내용을 곱씹어 봐야겠다. 실제로 사용자 경험을 이용한 디자인에 관한 예제들과 경험과 역사에 기반한 내용을 들어 차근차근 간결하게 설명해주고있다. 단지 것모습만 멋지고 좋은 것은 외견상의 문제이며 이는 일순간은 좋겠지만 그 내용과 어울리지 않는다면 훌륭한 디자인이라고 할 수 없겠다. 코닥이나 애플등의 예를 들면서 그들이 어떠.. 2009. 3. 2.
728x90
반응형