Hello_coding

인턴생활이 끝난 후 프론트엔드 관련 국비지원 프로그램을 알아보던중 멋쟁이사자처럼 프론트엔드스쿨을 알게 되었다. 국비지원에 대해 부정적인 시각이 많은 글들을 보아 걱정이 많았는데 프론트엔드스쿨은 후기가 좋아 주저없이 지원하게 되었다. 1차전형 1차전형은 자기소개서 제출이였다. 질문내용은 어렵지 않은 내용들이였으며 2개월간 인턴생활을 통해 부족했던 부분, 공부해야할 부분을 어느정도 정리해 두었기에 그런 내용을 잘 녹일려고 노력해서 썼던것같다. 다행히 1차는 무난히 합격하였다. 2차전형 2차전형은 간단한 html+css 과제 및 자기소개 영상이였다. 과제는 그닥 어렵지 않은 난이도였기에 프론트엔드에 관심이 있다면 충분히 구현할 수 있는 과제인것 같았다. 자기소개영상은 1차전형때 썼던 자기소개서를 참고하여 앞으..

종류 설명 작성 예 전체 선택자 문서의 모든 요소에 스타일 적용 * { margin : 0 ; } 타입 선택자 특정 태그를 사용한 모든 요소에서 스타일 적용 p { font-size : 12px; } 클래스 선택자 특정 부분만 선택해서 문서 안에 여러번 적용한다. 마침표( . )를 붙여 사용한다. .bg { backgroud-color : #ddd } id 선택자 특정 부분만 선택해서 문서 안에 한번만 적용한다. #를 붙여 사용한다. #container { width : 500 px ; } 그룹선택자 여러 요소에 같은 스타일을 적용할 때 사용한다. h1,h2 { text-align : center ; }

폼에서 사용하는 태그 폼의 시작과 끝을 만듬 폼 요소를 그룹으로 묶음 필드셋에 제목을 붙임 사용자가 내용을 입력할 필드를 삽입 , 드롭다운 목록을 삽입 택스트를 여러 줄 입력할 수 있는 텍스트 영역을 삽입 데이터 목록을 삽입 태그의 유형(type) text 한 줄 짜리 텍스트를 입력할 수 있는 텍스트 상자를 넣음 password 비밀번호를 입력할 수 있는 필드를 넣음 search 검색할 때 입력하는 필드를 넣음 url url 주소를 입력 할 수 있는 필드를 넣음 tel 전화번호를 입력할 수 있는 필드를 넣음 checkbox 여러항목에서 2개 이상 선택할 수 있는 체크 박스를 넣음 radio 여러항목에서 1개만 선택할 수 있는 라디오 버튼을 넣음 number 숫자를 조절할 수 있는 스핀 박스를 넣음 ran..

텍스트 관련 태그 제목. ~까지 사용할 수 있으며 숫자가 커질수록 글자 크기는 작아짐 텍스트 단락. 내용이 길면 엡 브라우저 창의 너비에 맞게 자동으로 줄 바꿈. 줄바꿈 텍스트 단락 중 원하는 위치에서 줄 바꿈 내용인용. 다른 내용보다 들여 쓰고 단락으로 표시 중요하지는 않지만 굵게 표시 중요한 텍스트를 기울게 표시 중요하지는 않지만 기울게 표시(마음속 생각,용어 등..) 내용을 편집할 때 추가한 내용 표시 내용을 편집할 때 삭제한 내용 표시 / 위 첨자/ 아래첨자 목록 관련 태그 순서 있는 목록의 시작과 끝 순서 없는 목록의 시작과 끝 순서 있는 목록이나 순서 없는 목록의 각 항목을 나타냄 설명 목록의 시작과 끝 설명 목록의 이름(제목) 설명 목록의 값(설명) 표 관련 태그 표를 나타냄 표의 제목을 넣..

html ? Hyper Text Markup Language , 웹 문서를 만드는 언어이다. 태그? 웹 브라우저가 어느부분이 제목,텍스트 또는 표인지 구별할 수 있도록 꼬리표를 붙여야한다. 이때 꼬리표를 태그(tag)라고 한다. 이름을 보고 의미를 유추할 수 있어 시맨틱 태그라고도 한다. HTML 문서 기본구조 //현재 문서가 HTML5언어로 작성한 웹문서이다. //웹문서의 시작과 끝을 나타내는 태그 //웹 브라웅저 화면에 나타나는 내용 시맨틱 태그 시맨틱 태그를 사용하는 이유 : 가독성이 좋아지기 때문이다. 주요 시맨틱 태그 헤더 영역을 의미한다. 사이트 전체의 헤더도 있지만 특정 영역의 헤더도 있다. 사이트에서 헤더는 주로 맨 위쪽이나 왼쪽에 있으며 , 검색 창 이나 사이트 메뉴를 삽입한다. 네비게이..

이 전화 키패드에서 왼손과 오른손의 엄지손가락만을 이용해서 숫자만을 입력하려고 합니다. 맨 처음 왼손 엄지손가락은 * 키패드에 오른손 엄지손가락은 # 키패드 위치에서 시작하며, 엄지손가락을 사용하는 규칙은 다음과 같습니다. 1. 엄지손가락은 상하좌우 4가지 방향으로만 이동할 수 있으며 키패드 이동 한 칸은 거리로 1에 해당합니다. 2. 왼쪽 열의 3개의 숫자 1, 4, 7을 입력할 때는 왼손 엄지손가락을 사용합니다. 3. 오른쪽 열의 3개의 숫자 3, 6, 9를 입력할 때는 오른손 엄지손가락을 사용합니다. 4. 가운데 열의 4개의 숫자 2, 5, 8, 0을 입력할 때는 두 엄지손가락의 현재 키패드의 위치에서 더 가까운 엄지손가락을 사용합니다. 4-1. 만약 두 엄지손가락의 거리가 같다면, 오른손잡이는 오..

[매개변수] s : 일부 자릿수가 영단어로 바뀌어졌거나 , 바뀌지않고 그대로인 문자열 return값 : s가 의미하는 원래 숫자 [제한사항] 1 ≤ s의 길이 ≤ 50 s가 "zero" 또는 "0"으로 시작하는 경우는 주어지지 않습니다. return 값이 1 이상 2,000,000,000 이하의 정수가 되는 올바른 입력만 s로 주어집니다. [풀이] function solution(s) { let numbers = ["zero", "one", "two", "three", "four", "five", "six", "seven", "eight", "nine"]; var answer = s; for (let i=0;i

로또 6/45(이하 '로또'로 표기)는 1부터 45까지의 숫자 중 6개를 찍어서 맞히는 대표적인 복권입니다. 아래는 로또의 순위를 정하는 방식입니다. [매개변수] lottos : 민우가 구매한 로또 번호를 담은 배열 win_nums : 당첨번호를 담은 배열 return값 : 당첨가능한 최고순위,최저순위 [max,min] [제한사항] lottos는 길이 6인 정수 배열입니다. lottos의 모든 원소는 0 이상 45 이하인 정수입니다. 0은 알아볼 수 없는 숫자를 의미합니다. 0을 제외한 다른 숫자들은 lottos에 2개 이상 담겨있지 않습니다. lottos의 원소들은 정렬되어 있지 않을 수도 있습니다. win_nums은 길이 6인 정수 배열입니다. win_nums의 모든 원소는 1 이상 45 이하인 정수..

새로 가입하는 유저들이 카카오 아이디 규칙에 맞지 않는 아이디를 입력했을 때, 입력된 아이디와 유사하면서 규칙에 맞는 아이디를 추천해주는 프로그램 [매개변수] new_id : 신규 유저가 입력한 아이디 [제한사항] 아이디 길이는 3자이상 15자 이하 아이디는 알파벳 소문자, 숫자, 빼기(-), 밑줄(_), 마침표(.) 문자만 사용할 수 있음 단, 마침표(.)는 처음과 끝에 사용할 수 없으며 또한 연속으로 사용할 수 없음 [처리단계] 1단계 new_id의 모든 대문자를 대응되는 소문자로 치환합니다. 2단계 new_id에서 알파벳 소문자, 숫자, 빼기(-), 밑줄(_), 마침표(.)를 제외한 모든 문자를 제거합니다. 3단계 new_id에서 마침표(.)가 2번 이상 연속된 부분을 하나의 마침표(.)로 치환합니..

변수란? 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름. 즉, 값의 위치를 가리키는 상징적인 이름이다. 식별자? 어떤값을 구별해서 식별할 수 있는 고유한 이름. 변수이름을 식별자 라고도 한다. 식별자는 값이 아닌 메모리 주소를 기억하고있다. 즉, 식별자로 값을 구별한다는 것은 식별자가 기억하고 있는 메모리 주소를 통해 메모리 공간에 저장된 값에 접근할 수 있다는 의미다. *식별자라는 용어는 변수이름에만 국한해서 사용하지 않고 변수,함수,클래스등의 이름 모두 식별자로 쓰인다. 변수선언? 변수를 생성하는 것. 자세히 말하면 값을 저장하기 위한 메모리 공간을 확보하고, 변수이름과 확보된 메모리 공간의 주소를 연결해서 값을 저장할 수 있게 준비하는것이다. 변..