빵 입니다.

기능 정의 Todo 입력 Todo 수정 Todo 삭제 Todo Total 갯수 체크 Todo 완료 갯수 체크 Todo 미완료 갯수 체크 시각적으로 보이는 리스트들을 todo들 관리를 쉽게하기 위해 배열에 넣었다. 배열을 관리하면 되기 때문에 상태 체크가 훨씬 쉽고 안정적이었다.초기 실행함수를 만들어서 todo 추가하는 기능을 바인딩했다. (최초의 이벤트 바인딩)부분적으로 스트링 템플릿을 사용해서 html에 있던 코드들을 많이 생략할 수 있었다.ES6의 let, const, map, filter 등을 사용해서 코드를 더 간결하게 만들었다.Todo 가 간단한 구조이기 때문에 변경될 때마다 화면을 새로 그리도록 만들었다. HTML Todo 추가 CSS @charset "UTF-8"; @import url(//..

기능 정의 Todo 입력 Todo 수정 Todo 삭제 Todo Total 갯수 체크 Todo 완료 갯수 체크 Todo 미완료 갯수 체크 어떻게 해야하는지 감이 잡히지 않아서 dom api만 가지고 개발을 했다.우선, 코드가 매우 비효율적이다.재사용할 수 있는 코드가 매우 적고, ES5, ES6 섞어 쓴 부분도 많다.자바스크립트보단 html, css 단에 더 집중을 많이 한 느낌이 든다. HTML Todo 추가 완료 0건 미완료 0건 총 0건 CSS .todo_wrap{width:300px; margin:0 auto;} .todo_wrap h1{text-align:center;} .input_wrap{background:red;} .input_wrap:after{content:""; display:bloc..

라인프렌즈 클론사이트를 만들었습니다. 기존 사이트 https://www.linefriends.com/snackparty 클론사이트 http://webduck.dothome.co.kr/

마크다운( http://kirkstrobeck.github.io/whatismarkdown.com/ ) 마크다운은 WYSIWYG(What You See Is What You Get) 방식의 포맷팅이다. 가장 좋은 방법으로 단순화되어 있다.웹 디자이너와 개발자가 프로젝트를 접근할 때, 프로젝트에 스타일을 만든다. 이 스타일은 헤더와 링크같은 것들이 어떻게 보여질지 같은 기본적인 요소인에 대해 기술한 것이다.과거의 WYSIWYG 에디터들은 디자인 컨트롤하는 것에 너무 많은 것을 주었다. 누군가는 의도치 않게 디자인에 새로운 스타일(기울어진 빨간색 굵은 이탤릭 헤더처럼)이 추가할 수 있다. 보통은 의도적인 디자인 추가 였지만 불가피하게 바닥까지 경주가 이어졌기에 스타일 처리가 더 커지고 더 강해지고 밝아졌다...

회사에 교육 결재를 올리고 하루를 컨퍼런스에 투자했다.장소는 누리꿈스퀘어!!!! 회사랑 너무 가까워서 회사 가는 느낌이 들고........... 누리꿈스퀘어가 복잡해서 쉽게 찾을 수 있을까 걱정했지만, 저렇게 안내 표지판이 있어서 찾기 쉬웠다. 여느 행사와 마찬가지로 입장할 때, 경품 추첨권 겸 입장 팔찌를 준다. 사기업이 아닌 한국웹접근성평가센터에서 주최를 해서 그런지 실무에 유용한 자료집을 많이 주었다. 무거운 건 덤^^! 하지만 내용이 알차서 완전 이득! 국제회의실에서 컨퍼런스를 진행했는데, 장소에 비해 인원이 많이 없었다. 지금까지 많은 접근성 세미나와 컨퍼런스에 참석했는데, 다른 행사들보다 장애인분들이 많이 참석을 하셨다. 이번엔 사진을 많이 못 찍었다. 제일 인상 깊게 들은 섹션인 김현아 변호..

W3Schools 번역과 MDN 번역 및 검색을 통해 알게 된 점 위주의 정리 https://www.w3schools.com/js/js_arrays.asp https://msdn.microsoft.com/ko-kr/library/ccktxahf(v=vs.100).aspx https://msdn.microsoft.com/ko-kr/library/jj155291(v=vs.94).aspx 1. AJAX IntroAjax를 사용할 때의 장점 - 페이지가 로드 된 후에 웹 서버로부터 데이터를 읽을 수 있다. - 페이지를 다시 로드 할 필요 없이 웹 페이지를 업데이트 할 수 있다. - 백그라운드 상태로 웹 서버에 데이터를 보낼 수 있다.AJAX는 다음과 같이 결합하여 사용한다. - 웹 서버로부터 데이터를 요청하기 ..

대량의 데이터를 효과적으로 관리하는 매커니즘 = 자료구조배열, 리스트, 스택, 큐(대기 행렬), 트리(나무 구조)1. 배열 - 데이터를 빈틈없이 나열한 자료구조 - 일직선 상에 빈틈없이 데이터를 나열한 1차원 배열 - 테이블처럼 가로세로 빈틈없이 데이터를 나열한 2차원 배열 - 직육면체처럼 가로, 세로, 높이에 빈틈없이 데이터를 나열한 3차원 배열 - 유효한 데이터의 개수를 관리할 때 다른 변수를 사용2. 리스트 - 데이터를 순서대로 나열한 자료구조 - 데이터들이 화살표로 서로 연결되어 있어 데이터들이 떨어진 장소에 위치할 수 있다. - 데이터 위치에 구애 받지 않는다. - 데이터들이 ‘포인터’로 연결되어 있다. - 따라서 데이터의 위치에 관계없이 데이터의 순서를 관리할 수 있다. - 유효한 데이터의 개..

W3Schools 번역과 MDN 번역 및 검색을 통해 알게 된 점 위주의 정리 https://www.w3schools.com/js/js_arrays.asp https://msdn.microsoft.com/ko-kr/library/ccktxahf(v=vs.100).aspx https://msdn.microsoft.com/ko-kr/library/jj155291(v=vs.94).aspx concat() 2개 이상의 배열은 연결하고, 연결된 배열을 반환. array1.concat(array2, array3, ..., arrayX) copyWithin() 배열의 지정한 위치 안에 있는 요소들을 복사. array.copyWithin(target, start, end) every() 배열 안의 모든 요소들이 설정한..