day 1. 자바스크립트 오리엔테이션 자바스크립트란? 웹브라우저라는 소프트웨어를 프로그래밍적으로 제어(브라우저의 기능을 코드로 이용)하는 언어 탈 웹브라우저 js는 웹브라우저 제어에만 국한되지 않고 있다. 아래와 같은 기능도 수행 가능. * 웹서버 'node.js' - 웹브라우저는 웹서버에 요청을 하고, 웹서버에서 웹브라우저에 응답을 보냄. - 응답하기 위한 기술. php와 자바가 하는 코드를 대체하기 시작. 탈 웹 - Google Apps Scripts 구글 스프레드 시트의 애플리케이션 스크립트를 조절할 수 있다. 코드(언어)라는 약속. js가 사용되는 환경이 늘고 다양화되고 있다. 다양한 환경(웹서버, 스프레드시트 등)속에서 js(기반이 됨)라는 언어를 적재적소에 잘 사용할 수 있음. 코드로 소프트웨..
Web
Codecademy front-end engineer course DAY19 Layout with Flexbox - What is Flexbox? 플렉스박스란? While flexbox is not meant to lay out entire pages, it is useful for positioning elements, whether individually or in groups. There are two important components to a flexbox layout: flex containers and flex items. - display: flex 플렉스 디스플레이 ;한줄에 배열해주는 속성 Flex containers are helpful tools for creating website..
Codecademy front-end engineer course DAY20 Learn Responsive Design 2) Media Queries **When a website responds to the size of the screen it’s viewed on, it’s called a responsive website. -Media Queries [미디어 쿼리란?] CSS uses media queries to adapt a website’s content to different screen sizes. -An example of media queries- @media only screen and (max-width: 480px) { body { font-size: 12px; } } @medi..
Codecademy front-end engineer course DAY17 Secondary navigation - About the Secondary Navigation 1) What is Secondary Navigation? Primary navigation contains the most important links and buttons that need to be displayed on every single page of the site. Secondary navigation consists of a clickable list of pages or attributes that led to the current page. It can help users understand the extent ..
Codecademy front-end engineer course DAY16 Links & Button Showing interactivity and clickability through signifiers is a fundamental aspect of user interface design. - Browser Link Styles [링크 스타일] However, it’s important to note that maintaining a consistent user experience pattern, like the default behavior applied by browsers, is important for creating a consistent experience. a{ color:blue; t..
Codecademy front-end engineer course DAY15 Learn Text Design - Differentiating Text : HTML Headers [헤더를 적절히 이용하자.] — Used for titles. You should only have one header this style per page. — Used for headings. This should be to identify major sections you want the user to immediately be drawn towards. — Used for subheadings. This should be used for smaller focal points, such as articles, that you ..
Codecademy front-end engineer course DAY14 Learn CSS: Learn Color for UI - Contrast Constraints [대비를 적절히 사용하자.] : Contrast is a great way to differentiate elements on a page. However, When thinking about and applying contrast to a page through the use of color, it’s important to limit the overall amount of contrast. -Brand Color [브랜드 컬러를 참조하자.] : This brand color will account for roughly 60% of ..
Codecademy front-end engineer course DAY13 Learn CSS: Documentation&Debugging Learn CSS: Color Theory Documentation is an essential tool to learn about properties. 1. MDN the source of documentation for HTML, CSS, and JavaScript. https://developer.mozilla.org/ko/ MDN Web Docs MDN 웹 문서 사이트는 HTML, CSS, 및 웹 사이트와 프로그레시브 웹 앱을 위한 API를 포함한 오픈 웹 기술에 대한 정보를 제공합니다. 또한 Firefox 개발자 도구와 같은 Mozilla 제품을 위한 개발자..
