공부블로그

우선, 웹 개발에서 사용되는 전형적인 기술 스택에 대해 알아보자. 프론트엔드(클라이언트 측): HTML(HyperText Markup Language): 웹 페이지의 구조를 정의하는 마크업 언어입니다. CSS(Cascading Style Sheets): 웹 페이지의 스타일을 정의하는 스타일 시트 언어입니다. JavaScript: 웹 페이지의 동적인 동작을 제어하고 사용자와 상호 작용하는 프로그래밍 언어입니다. 프레임워크 및 라이브러리: Vue.js(Nuxt.js), React.js(Next.js), Angular 등의 프론트엔드 프레임워크 및 라이브러리를 사용하여 웹 애플리케이션을 개발합니다. 백엔드(서버 측): 웹 서버: 클라이언트 요청을 받아들이고 응답하는 소프트웨어입니다. 예를 들어, Node.js..

1. 아이콘 직관적 : 지나치게 단순화하거나 본인만 아는 아이콘 X 통일성 단순성 : 작은 크기에서도 파악할 수 있는 형태 규격 및 시각보정 : 안전한 영역 안에서 작업, 시각적으로 부피의 면적이 동일한지 확인 ( 시각보정 ) 2. 타이포그래피 - 어떤 앱이 읽기 편한가요? 'UI 내 정보 전달, 우선순위에 따른 강약조절'이 있는 것 Typegraphy란? Type(활자) + Graphy(-술) : 활자의 서체나 글자배치 등의 구성 및 표현 타이포그래피 요소 서체 종류 ( 제목용 & 본문용, 고딕, 명조, 손글씨 ) 서체 크기와 두께 텍스트 컬러 ( 가독성과 연관! ) ※ 앱 UI 디자인 작업 시 타이포그래피가 중요한 이유 ※ 위계 구조 표현 정보전달을 위한 가독성 유효성 검사 충족된 크기, 대비 활용 ..

1 . 앱 디자인 레이아웃과 그리드 시스템 앱에서는 단조로운 레이아웃을 사용한다. 앱 ui 디자인 작업 시 그리드 시스템에 맞게 레이아웃을 구성해야 하는 이유 시각적으로 일관된 배치 작업 시간 단축 예측 가능한 화면 구성 [ 레이아웃을 위한 그리드 시스템 구성요소 ] Column (화면을 몇 단으로 쪼개는지, 유동적): 4단 or 6단 Gutter (단과 단 사이의 거리, 고정값): 16 Margin (컨텐츠 영역을 제외한 좌우 여백) : 16 or 20 좁은 화면의 단점을 해결하는 레이아웃: 가로 스크롤 ( 어떤 해상도에서든 컬럼 수, 거터, 마진을 유지해야하고 해당 그리드시스템에 맞게 디자인해야한다! ) 2 . UI 컬러 앱 ui 디자인 작업시 컬러가 중요한 이유 우선 순위 표현 가능 상황에 따른 컬..

https://school.programmers.co.kr/learn/courses/30/lessons/150370 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 오랜만에 알고리즘*^^* 테스트케이스 19번에서 걸렸는데 찾아보니까 유효기간이 100달일때를 고려해야했다! function solution(today, terms, privacies) { var answer = []; let arr_terms = {} terms.forEach(term => { if(term.length >= 5){ //유효기간이 100인 경우 arr_terms[term[0]] ..

회선 교환 회선 독점을 통한 통신방식이다. 위와 같이 전송을 위한 전용선을 할당하고 해당 선로로 모든 데이터를 전송한다. 핵심은 " 전용선 설정 "이다. 특징 및 장단점 통신 회선을 설정하여 데이터를 교환하는 방식이다. 쉽게 말해 전화망 ( 사이에 끼어들 수 없다. ) 송신자의 모든 데이터는 동일한 경로로 전송된다. 안정적인 통신 가능하고 전송 지연이 없고 데이터 전송률이 일정하다. 그러나 회선 이용 효율이 떨어지고 문제가 발생할 경우 전체 연결이 끊어지기 때문에 새로운 회선 할당이 필요하다. 위의 단점을 극복하기 위해 다중화라는 개념이 탄생한다. - 주파수 분할 다중화 한 전송로의 대역폭을 여러개의 작은 채널로 분할하여 여러 단말기가 동시에 이용하는 방식. 채널간에 상호간섭을 막으려면 보호 대역이 필요..

기초문법 php코드는 웹 페이지의 어느 부분에나 위치할 수 있다. php파서가 php코드를 인식하기 위해 시작과 끝을 알려줘야 한다. 즉, 은 출력용 태그라고 생각하자 마지막 ; (세미콜론) 주석 : // 출력 echo - 문자열 여러개 출력, 리턴값 X / print - 함수처럼 사용, 문자열 하나 출력, 항상 리턴값 1 변수 지역 변수 : 함수 내부에서 선언된 변수는 오직 함수 내부에서만 접근, 함수 호출이 종료되면 메모리에서 제거되므로 함수 밖에서 접근 불가 전역 변수 : 함수 밖에서 선언, 접근 함수 내부에서 전역 변수를 사용하고 싶다면 global키워드를 사용 정적 변수 : 함수의 호출이 종료되더라도 메모리 상에서 사라지지 않으므로 생성과 소멸을 반복하지 않고 함수 안에서 값이 공유된다. + $..

자바스크립트에서 자료를 가져오고 뿌릴 때 자주 사용하게 되는 구조분해 할당을 정리해보자 간단하게 말하면 객체안의 각각의 요소를 하나씩 분해해주는 것~ 기본할당 var o = {p: 42, q: true}; var {p, q} = o; console.log(p); // 42 console.log(q); // true 새로운 변수 이름으로 할당 var o = {p: 42, q: true}; var {p: foo, q: bar} = o; console.log(foo); // 42 console.log(bar); // true 기본값 : 객체로부터 해체된 값이 undefined인 경우 변수에 기본값을 할당할 수 있다. var {a = 10, b = 5} = {a: 3}; console.log(a); // 3 c..

시작하기 기존 사이트에서 Vue를 사용하려면 // CDN 인스턴스의 속성 el : Vue가 실행되는 html DOM요소를 지정, CSS선택자를 사용 ( ex. id: #, class: .접두어 사용 ) data : Vue인스턴스가 관리하는 데이터, reactivity 반영 ( data 변경 시 화면 자동 반영 ) template : 화면에 표시할 요소 ( html, css 등 ) props : 부모컴포넌트의 데이터를 받을 수 있는 속성의 리스트([]) methods : 화면의 동작 및 이벤트 로직을 제어하는 메소드 선언 computed : 데이터 표현을 더 직관적이고 간결하게 도와주는 속성 ( 종속 대상에 따라 캐싱, Validation처리, 간단한 연산 등에 적합 ) watch : data에 정의한 속..