본문 바로가기

DeVsign

(17)
프로토파이톤'19에 참여해보았다 처음으로 해커톤에 참여해보았다. 프로토파이를 이용해 어디까지 만들 수 있는지를 실험해보는 시간이었다. 프로토파이톤은 1시부터 8시까지 진행되었다. 약 4시간 30분 정도가 작업시간, 그 이후는 네트워킹과 피자타임, 투표와 그룹별 발표, 수상 순서로 이어졌다. Design Spectrum ProtoPie와 디자인 스펙트럼이 해커톤을 만듭니다 ! 그동안 실험해보고 싶었던 프로토타이핑을 프로토파이톤에서 진행해보세요. - 일시 : 2019년 7월 6일 (토) 13:00 - 20:00 위치 : 성수동 카우앤독 (서울특별시 성동구 성수1가1동 왕십리로2길 20) 인원... www.facebook.com 참여 신청을 하고 나서 무슨 화면을 만들어볼까 고민했다. 나는 프로토파이의 아주 기초적인 트리거만을 사용해왔기 때..
javascript array method : indexOf MDN에서 array 메소드 중에 많이 쓰는 것들을 그대로 따라 작성 해 보고 있다. 그중 indexOf메소드를 공부해 보았다. https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf Array.prototype.indexOf() indexOf() 메서드는 배열에서 지정된 요소를 찾을 수있는 첫 번째 인덱스를 반환하고 존재하지 않으면 -1을 반환합니다. developer.mozilla.org indexOf는 배열의 몇번째 요소로부터(fromIndex) 검색해 나오는 인덱스를 반환하는 메소드다. var beasts = ['ant','bison','camel','duck','bison']; conso..
Javascript# 동적 바인딩 개념 다시 잡기 아 정말 자바스크립트 어렵다. 왜냐 나는 처음이니까, 라며 위로해 보지만, 자바스크립트 수업을 들은 지 이미 3주 차에 접어들었다. 오늘은 '호출될 때마다 1씩 증가한 값을 반환하는 함수'를 만드는데, 동적 바인딩을 이용해 코드를 작성하는 시간이 있었다. 난 분명 수업을 들었는데 막상 코드를 짜려니 심각하게 머릿속이 새하얘졌다. 코드를 못 짜는 이유는 뭐다? 복습과 연습을 하지 않았기 때문이다. 오늘은 동적 바인딩을 이해할 때까지 잠을 청할 수 없을 것 같다. 동적 바인딩이란? 객체 생성 '이후'에 새로운 속성을 객체에 추가하는 것. 아래 예시에서는 plusCount라는 함수를 생성하였고 counter라는 인자를 대입하였다. 만약 counter 아규먼트가 undefined가 아니라면(여기서는 1이라는 숫..
디프알# Gatsby.js 시작하기 내가 프로그래밍을 공부하는 이유는, 생활 속에 필요하거나 재미있을 것 같다고 생각하는 여러가지 아이디어를 '직접 개발하고 싶어서'다. 그중에서도 리액트를 공부하는 이유는, 언제든지 재사용 가능한 컴포넌트들의 모음인 '디자인 시스템'이 나의 프로젝트에 꼭 필요하기 때문이다. 생활코딩에서는 '직접 만들자 병'이라고 지칭하기도 하는데, 나도 갈증이 아주 많다. 리액트든 개츠비든 이름만 들어도 두렵지만, 이 벽을 뚫은 후에는 다른 세상이 열릴 거라고 확신하면서 공부를 시작하겠다.Gatsbyjs는 React 기반의 정적 페이지 생성 프레임워크라고 한다. React를 공부하는데 난데없는 Gatsby 무엇. 둘의 관계는 gatsbyjs.org의 첫페이지에 인포그래픽으로 표현되어 있다. 해석을 대략 해 보면, 여러 가..
디프알# 개발의 문턱 Framer X 가 나온 후 나는 Framer, Framer X 둘 다 쓰지 않는 지경에 이르렀다. Framer Classic은 점점 사용하지 않는 추세였고, X를 쓰려면 그 전에 준비해야 할 게 너무 많았다. 뭐부터 해야 하는지 감도 없었다. 김이 많이 빠졌다. 프로토타입의 개념 조차 없던 회사에서 나는 여러가지 새로운 시도를 했고 그 중 하나가 프레이머였다. 개발과 거의 흡사하게 세밀한 모션을 구현했고 개인적으로도 즐거움과 성취감을 느꼈었는데 기껏 공부했던 게 허탈하게 사라져버렸다. 아무도 배우지 않는 것을 혼자서 겨우 쓰다가 이제는 Protopie로 넘어간 상태다. Framer for Designers라는 문장은 말인지 막걸리인지 납득 불가 상태가 되었다. 그래서 포기..는 아니고, 차근차근 공부를..
워드프레스 HTTP error 500문제 해결 게으름으로 며칠간 미루게 되었던 HTTP error 500 을 해결했다. ============================== 페이지가 작동하지 않습니다. 현재 www.congjang.com에서 요청을 처리할 수 없습니다. HTTP ERROR 500 ============================== 세상마상 이 에러의 정체는? 404에러도 아닌 500이라니, 그래서 내 사이트는 반 비정상이었다. 태그 / 카테고리 / 메뉴를 클릭하면 페이지가 잘 나오는데, 날짜/글제목/댓글을 누르면 페이지가 뜨지 않고 저런 에러메시지가 나타났다. 링크도 잘 안 걸린 개인 홈이라니, 나만 보고 있어서 참으로 다행이긴 하지만 스스로 답답했다. 아무리 원인을 찾아 보아도 방법이 나와 있지 않았다. 에러 코드 번호만 보고..
Framer 도전기 #번외편 Framer X Beta 와의 만남 대기번호 1751번. 초대장을 손꼽아 기다려 왔는데, 드디어 Your Framer X Beta invite라는 제목의 메일을 받았다. 왔네왔어. 다운로드를 받습니다. 일단 지금 난 너무 떨리므로, 어떤 것도 제대로 해 볼 수 없을 것이다. 그보다는 Framer와 언어부터 다르기 때문에 건드릴 수 없다는 것을 알고 있다. 대략적인 리뷰를 해 보도록 하겠다. 기분탓인가 다운로드 속도는 왜 이리도 느린 것인가. 빨리빨리. 설치 빨리빨리. 첫화면을 접한 소감 외관이 몹시 심플하다. 베타 버전에서 가장 중요한 네 가지 메뉴만을 보여주고 있다. 정식 버전의 메인화면은 어떨지 기대가 된다. video를 누르면 지금까지 예고해 왔던 소개 영상들을 볼 수 있다. 그다음 Docs. Docs는 Framer를 공부할 때도 가..
Framer 도전기 #8 stateCycle()로 Toggle Switch버튼 만들기 이번에는 간단하게 toggle switch button을 만들어보았다. #Layer 먼저 레이어는 토글버튼의 bg와 핸들링 할 수 있는 스위치 버튼의 두 가지다. 이때 버튼의 크기는 고정 좌표로 하지 않고 계산하는 방식을 택했다. 스위치 버튼의 크기에 따라서 toggleBG 의 사이즈도 조절되도록 짜 보았다. toggleBG의 가로사이즈는 switchBtn의 사이즈의 두배에 패딩값의 두 배를 더한 값이다. 그리고 switchBtn의 maxX를 toggleBG width값의 2분의 1로 설정하면, 토글 스위칭의 on/off위치는 toggleBG의 2분의 1기준에서 좌,우로 이동하게 설정하기 편하다. #States 이번에도 역시 stateCycle()을 이용한다. default와 다른 한 개의 state가 ..