신나는 개발자

나는 원래 컴퓨터공학을 전공하면서 HTML. CSS보다 프로그래밍 언어인 JavaScript에 더 관심이 있어서 이번 수업에 더 관심이 많았다. AWS와 데이터 베이스 먼저 자바스크립트를 하기 전 데이터베이스에 대해 4일 짧게 공부하였다. AWS환경에 RDBMS인 mySQL과 noSQL인 mongoDB를 깔아서 사용해보았다. AWS를 처음으로 환경을 셋팅하고 실행을 해보았는데 예전에 OS를 공부할 때 가상 머신으로 사용하던 우분투의 CLI환경과 별 다른게 없다. 또한 RDBMS인 mySQL은 써본적이 있어서 익숙했지만 mongoDB의 경우는 처음 써보아서 매우 낯설었지만 쉽고 다른 프로그래밍 언어와 비슷한 특성 가져서 공부를 하면 익숙하게 할 수 있을 거 같았다. 자바스크립트 자바스크립트는 기존에 다른 ..

패스트캠퍼스/패캠 오프라인 2020. 4. 25. 20:42

html, css 반응형 웹 프로젝트 프로젝트 github 프로젝트를 시작하면서 패스트캠퍼스에서 html과 css수업을 끝내고 간략한 프로젝트를 진행하기로 했다. 해당 프로젝트는 강사님이 주신 피그마 파일을 가지고 만들게 되었다. 프로젝트를 진행하면서 강사님이 중요하게 여긴것은 웹접근성이었다. 그래서 최대한 배운내용과 기술 사이트등을 참고하며 만들었습니다. 만들면서 참고한 사이트 웹접근성 널리 레진코믹스 github AOA 접근성 유튜브 아쉬운 점 하지만 그럼에도 불구하고 몇가지 놓친점이 있어서 아쉬웠습니다. a에 role=button을 통해 링크가 아닌 버튼임을 알려주고aria-pressed="true"로 클릭이 된다는것을 알려주는게 좋다고 하셨다. 보이지는 않지만 처음 텝키가 갔을때 바로가기 키을 넣..

패스트캠퍼스/패캠 오프라인 2020. 4. 11. 18:43

반응형으로 개발할 때 실 디바이스로 테스트가 중요하다. 크기를 1px단위로 확인하면서 반응형으로 짤려면 엄청 힘들다. img에서 srcset를 사용하여서 해상도에 따라 image의 크기를 바꿔줄 수 있다. 높은 해상도에서 이미지의 픽셀이 깨지는 것을 방지한다. css에서도 방지할 수 있지만 html에서 사용하면 성능면에서 좋다. /* 1.25 dpr */ @media (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi){ /* Retina-specific stuff here */ } /* 1.3 dpr */ @media (-webkit-min-device-pixel-ratio: 1.3), (min-resolution: 124.8dpi){ /*..

패스트캠퍼스/패캠 오프라인 2020. 4. 6. 18:56

2주차에 배운 내용 반응형 프레임워크를 사용해 프로토타이핑을 제작해보면 설계하는데 많은 시간을 절약 할 수 있습니다. 하지만 프로토타입에서만 사용해야하고 실제 만들 제품은 사용하지 않는것이 좋다. Bootstrap Foundation Bulma UI Kit Semantic UI : 시맨틱 요소를 생각하여 만들어진 프레임워크라 좋다. html6 : 다양한 태그들이 추가된다. required input 태그에 사용되는 속성으로 유효성을 체크한다. 유효성체크는 예전에는 자바스크립트로만 가능했지만 html에서 가능해졌다. time required와 비슷하게 예전에는 자바스크립트로 설정한 시간들을 태그를 사용하여 설정 할 수 있다. 정렬방법 text-align(black요소) vertical-align(inlin..

패스트캠퍼스/패캠 오프라인 2020. 3. 28. 22:34

1주간 배운 내용 Web Browser Extension Web Developer : 웹 브라우저 조작 HeadingsMap : 헤더 확인 OpenWAX : 웹 접근성 확인 tota11y : wcag에서 몇가지 중요 개념 체크 Gitzip For Github html 구조파악 html은 구조, css는 레이아웃 및 디자인, javascript는 동작으로 구별하여서 구조를 짜야한다. html에서의 id와 class의 네이밍 하기 css에서 사용할 class와 id의 값을 정해준다. 네이밍 방법론 class는 중복이 허용되고 id는 중복 되면 안된다. html에서의 tip 이모티콘의 경우는 아래 css에서 적용을 한다. 특수기호의 경우는 일반 문자로 인식하기 떄문에 엔티티 기호를 사용해야 한다. ui의 작업..

패스트캠퍼스/패캠 오프라인 2020. 3. 22. 20:08