Etc96 웹 앱 화면 설계하기 와이어프레임 설계 HTML로 웹 앱 구조 잡기 id와 class의 이해 와이어프레임 설계 및 목업 구현 🕸️ 와이어프레임(Wireframe) 레이아웃의 뼈대를 그리는 단계로, 가장 큰 목적은 화면의 영역을 구분하는 일이다 🖼️ 목업(Mock-up) 실제 서비스가 작동하는 모습과 동일하게 HTML, CSS을 작성 HTML로 웹 앱 구조 잡기 1. 만들고 싶은 웹 페이지 구조를 생각해 보고, 어떤 태그를 이용해야 할지 생각한다 2. 영역 별로 여러 태그를 하나의 태그(div 등)로 감싸 준다 → form으로 감싸 줄 경우 div 요소를 사용하는 것보다 더 시맨틱한 요소 사용이다 input, button 요소 등의 자식 요소를 감싸는 경우에 자주 사용되는데, 페이지 전환이 되는 액션이 발생할 수 있도록 주의해.. 2022. 6. 28. 페이지 레이아웃 웹 사이트 성격과 목적에 맞게 HTML 구조 만들기 Flexbox flex-direction flex-wrap justify-content align-items align-content grow shrink basis 레이아웃: 화면을 나누는 방법 📏 수직 분할, 수평 분할 CSS로 화면 구분 시 수직 분할과 수평 분할을 차례로 적용하여 콘텐츠 흐름에 따라 작업한다 Atomic CSS 방법론: 클래스 이름과 구현을 1:1 일치시켜 작은 단위로 CSS를 작성한다 영역1 영역2 영역3 🎈 레이아웃 리셋 HTML의 기본 스타일이 레이아웃에 방해가 될 때 1. 태그의 여백 2. width, height 계산이 여백을 포함하지 않음 (box-sizing 참고) 3. 브라우저마다 기본 스타일이 약간씩 다름 해결 방.. 2022. 6. 28. [JAVA] 백준 2751번: 수 정렬하기 2 시간 복잡도가 O(nlogn)인 정렬 알고리즘으로 풀 수 있다 💡 1. Colletions.sort()를 사용한다 시간 복잡도 O(n) ~ O(nlogn)을 보장한다 단, 배열 대신 리스트를 사용해야 한다 2. StringBuilder를 사용한다 String과 문자열을 더할 때 새로운 객체를 생성하지 않고 기존 데이터에 더하는 방식이다 속도가 빠르고 부하가 적다 import java.util.*; public class Main { public static void main(String[] args) { StringBuilder sb = new StringBuilder(); Scanner sc = new Scanner(System.in); int n = sc.nextInt(); ArrayList list.. 2022. 6. 27. CSS css의 이해와 기본 구조, 문법 HTML에 적용하는 방법 텍스트 꾸미기 기본적인 박스 모델 MDN, W3C School에서 속성 검색하고 사용하기 CSS Cascading Style Sheets → 좋은 사용자 경험(UX; User Experience)을 제공 스타일링 도구이기 때문에 독립적으로 기능하지 않고, HTML가 있어야 동작한다 🍭 사용자 인터페이스(UI; User InterFace) 인터페이스: 컴퓨터와 교류하기 위한 연결고리 - 이전 시대에는 CLI(Command Line Interface)를 사용해야 했다 ⚒️ 기본 구조와 문법 body { margin: 0; padding: 0; background: #fff; color: #4a4a4a; } header, footer { font-si.. 2022. 6. 27. HTML HTML의 이해와 기본 구조, 문법 마크업 언어 자주 사용되는 요소: , , , , , 등 시맨틱 태그 HTML HyperText Markup Language: 웹 페이지의 틀을 만드는 마크업 언어 마크업 언어란? 태그 등을 이용하여 문서나 데이터 구조를 표현한다 시맨틱 요소란? 자체에 의미를 가지는 요소, 속성을 보지 않고도 이름만 봐서 파악이 가능하다 이름에 의미를 붙여 부르는 태그 ⚒️ 기본 구조와 문법 · Tag(부등호()로 묶인 HTML의 기본 구성 요소)들의 집합 · Tree Structure: 문서 시작 → html ⊃ head, body · SELF-CLOSING TAG: 닫는 태그가 없는 경우(태그 내부에 내용이 없는 경우) Hello world Contents here Here too!.. 2022. 6. 27. [JAVA] 백준 2752번: 세수정렬 💡 해결 방법 숫자가 최대 1,000,000개가 주어지는데 시간 제한이 1초인 문제이다 시간 복잡도가 O(N * logN)이어야 하므로 퀵 정렬을 사용했다 🛑 주의 시간 복잡도 O(N * logN)를 요구하는 문제에서 최악의 복잡도가 존재하는 퀵 정렬을 사용할 경우 일반적으로 오답으로 처리된다 다른 해결 방법이 있는지 탐색할 것! import java.util.*; public class Main { public static void quickSort(int[] data, int start, int end) { if (start >= end) { //원소가 1개일 때 return; } int pivot = start; //pivot은 첫 번째 원소 int i = start + 1; int j = end;.. 2022. 6. 26. 이전 1 ··· 4 5 6 7 8 9 10 ··· 16 다음
