odada

체크리스트 웹표준 -- -- 해당서비스의 Doctype을 따르고 있는가? html5 Doctype (필수) HTML validator 통과했는가? (필수) CSS validator 통과했는가? (필수) Cross Browsing 되는가? Web(Window) FF/Chrome/Safari/Opera (최신) Web(Mac) FF/Chrome/Safari/Opera (최신) Mobile(Android) Android 14 (현재 버전) Android 13 Android 12 Android 11 Android 10 (2021년 기준 점유율 1위) Mobile(iOS) iOS 15(현재 버전) iOS 14 (2021년 기준 점유율 1위) 웹접근성 -- (필수) title 태그에 서브페이지 제목을 제공하였는가?..

회원가입, 게시판, 주문, 장바구니 등을 구현하려면 개발을 해야 하지만 사이트를 만들 때마다 백엔드 개발자의 도움을 받을 수 없기 때문에 빌드를 사용해 사이트를 만들 수 있다. 그누보드5 호스팅 준비 로컬(내 컴퓨터)가 아닌 웹서버에 설치해야 하기 때문에 호스팅을 구매해 설치한다. cafe24 https://hosting.cafe24.com/?controller=new_product_page&page=autobahn 닷홈 https://www.dothome.co.kr/web/premium/index.php (도메인 구매시 무료) https://www.dothome.co.kr/web/free/index.php (무료) 설치 1. 수동설치 그누보드 다운로드 https://sir.kr/g5_pds 그누보드 설..

DOM Dom (Document Object Modal) 이란 HTML 문서를 객체로 표현한 것으로 JS에서 HTML을 제어할 수 있게 해줍니다. Node vs Element 노트(Node) : HTML 요소, 텍스트, 주석 등 모든 것을 의미 요소(Element) : HTML 요소를 의미 DOM node 란? // 지정된 id값을 가진 요소를 반환 document.getElementById("someid"); // 지정된 클래스 이름을 가진 모든 하위 요소의 개체를 반환 document.getElementsByClassName("someclass"); // 지정된 태그 이름을 가진 요소의 HTML 모음을 반환 document.getElementsByTagName("LI"); // 지정된 class와 일..

https://brunch.co.kr/@chulhochoiucj0/8 모바일 UI·UX 디자인 시 고려해야 할 가이드라인 1 애플 iOS HIG와 Material design 가이드를 중심으로 | 모바일 앱과 웹 디자인은 데스크톱 웹 디자인과는 많은 부분이 다릅니다. 이는 각 기기 device의 특성과 사용 맥락의 차이에서 기인합니다. 우선 모 brunch.co.kr https://m2.material.io/design/guidelines-overview Material Design Build beautiful, usable products faster. Material Design is an adaptable system—backed by open-source code—that helps teams b..

자기소개서 쓰기 [#유퀴즈온더블럭] 인싸력부터 남다른 취업의 신 황인 자기님🤭 고스펙이 아닌데도 대기업 15곳을 합격할 수 있었던 꿀팁 대방출 https://youtu.be/xNcWZpufxb4 ChatGPT란? OpenAI 기반의 대화형 인공지능 현재 무료 + 프리미엄 서비스 제공 출시 1개월만에 1억명 이상 사용자 확보 소개 ChatGPT https://chat.openai.com/ ChatGPT of OPENAPI https://platform.openai.com/playground SYSTEM 역할제시 Temperature 단어 무작위 사용 (언어 생성 모델에서 생성된 텍스트의 다양성(degree of diversity)을 조절하는 하이퍼파라미터)입니다. 모델마다 최적의 temperature 값은..

폴더 경로 css outline (전체 레이아웃) goods (상품) board (게시판) event (이벤트) member (회원) mypage (마이 페이지) order (주문) popup (팝업창 페이지) proc (기타 페이지) service (고객 서비스)

#github #jekyll #깃헙 #깃허브 #지킬테마 안녕하세요. 오다다입니다. 이런 저런 사정으로 it에서 리뷰로 리뷰에서 it로 다시 돌아왔습니다. 블로거의 길도 쉽지 않네요. 오늘은 Jekyll을 사용하여 GitHub에서 포트폴리오 만들기에 대해 포스팅 해보겠습니다. 최근 대기업에서 채용시 GitHub 포트폴리오 제출이라는 문구가 많이 보입니다. GitHub은 버전관리 및 협업 툴로 사용하지 못하면 업무가 어렵기 때문입니다. ㅜㅜ 해서 포트폴리오 사이트도 GitHub에 만들면 프로젝트 업로드 및 관리가 쉽기 때문에 GitHub 블로그를 만들어 포트폴리오로 활용해봅시다. 그럼 간단하게 GitHub이 무엇인지 알아보고 포트폴리오 만드는 방법을 알아보겠습니다. GitHub 이란? 출처 입력 여러 개발자..

list https://eehd80.github.io/-setting/!list.html main https://eehd80.github.io/-setting/ Setting 프로젝트 시작시 사용할 수 있는 setting 파일입니다. main(master) 브랜치로 이동 signin 브랜치로 이동 list DEMO Naming Case (BEM) kebab-case(케밥 표기법) kebab-case, header-container, btn-list, menu-list ... (하이픈)으로 단어를 연결하는 표기법 HTML 태그의 class 속성으로 흔히 사용됨 camelCase(카멜 표기법) camelCase, typeName, lightBox, darkBox ... 기본적으로 변수명을 모두 소문자로 씀 ..

ScrollTrigger란? 동적인 사이트를 만들 때 빠지지 않고 사용하는 라이브러리 중 하나이다. 최소한의 코드로 스크롤 애니메이션을 구현할 수 있다. GSAP 공식사이트 https://greensock.com/docs/v3/Installation cdnjs https://cdnjs.com/libraries/gsap 1. setting //cdn //스크롤 트리거 불러오기(플러그인 안정화) 2. 기본 사용법 gsap.to(대상, { scrollTrigger:{ trigger:대상, 스크롤속성:값, 스크롤속성:값 }, 속성:값, duration:재생시간 }) 3. 샘플 https://greensock.com/scrollmagic/ See the Pen scrollTrigger by odada (@odad..

mdn 자바스크립트 기본 https://developer.mozilla.org/ko/docs/Learn/Getting_started_with_the_web/JavaScript_basics JavaScript 는 뭔가요? JavaScript 는 웹 브라우저에서 사용하기 위하여 만들어진 HTML과 웹의 프로그래밍 언어입니다. 왜 JavaScript를 공부해야합니까? JavaScript는 모든 웹 개발자 가 배워야 하는 3 가지 언어 중 하나입니다 . 웹 페이지의 내용을 정의하는 HTML 웹 페이지의 레이아웃을 지정하는 CSS 웹 페이지의 동작을 프로그래밍하는 JavaScript 웹 개발 JavaScript는 웹 애플리케이션의 동적인 기능을 구현하기 위해 필수적입니다. 웹 페이지에서 사용자와의 상호작용, 데이..