Vanilla JS Toy 프로젝트 - 1. Form Validator (javascript편) 포스팅 썸네일 이미지

VanillaJS

Vanilla JS Toy 프로젝트 - 1. Form Validator (javascript편)

여기에 올라온 모든 프로젝트와 소스코드는 here 여기서 확인할 수 있다. vanilla javascript Toy project 1. Form Validator 대망의 자바스크립트 부분까지 왔다. 간단한 웹사이트를 만드는데 필요한 설명이 이렇게 길어질줄 몰랐다. 진짜 일주일에 한번이 아니라 한달에 한번씩 업로드를 해야하는 상황도 올 수 있을 것 같다. 상대적으로 자바스크립트는 이번 웹 사이트에서 설명할 것이 좀 적기 때문에 이번 글로 다 마무리 할 것 같다. 이번 글에서 소개할 내용은 다음과 같다. 이번 프로젝트에서 사용할 DOM 구성요소 간단 설명 프로젝트에서 사용되는 모든 함수 설명 ShowError, ShowSuccess 로직 설명 이벤트 등록하기 0. INTRO vanilla javascript..

2022.01.09 게시됨

AtCoder Beginner Contest 211 A부터 D까지 업솔빙 포스팅 썸네일 이미지

알고리즘/atcoder

AtCoder Beginner Contest 211 A부터 D까지 업솔빙

AtCoder Beginner Contest 211 A부터 D까지 업솔빙 일본 친구들은 진짜 DP를 좋아하는 것 같다. C번 문제는 문자열 DP에, D번 문제는 BFS + 다익스트라 + DP문제를 내놓았다. 코드포스에서는 민트까지 DP가 거의 안나오는데, atcoder에서 높은 티어를 받으려면 dp를 무조건적으로 정복해야 할 것같다. 다행인거는 전형적인 dp가 맨날 나온다는 점? 문제 유형 다 외워버려야지.. 이번 대회에서 배운 점은 문자열 dp 다익스트라는 결국 BFS의 변형이다. 최단 경로 개수 찾기 문제 옆에 붙어있는 난이도는 Atcoder Problems 에서 추정한 것으로 작성했다는 것을 미리 알린다. A - Blood Pressure (*6) 접기/펼치기 문제 설명 사람의 수축기 혈압인 $A$..

2022.01.09 게시됨

Vanilla JS Toy 프로젝트 1. Form Validator - CSS편(2) 포스팅 썸네일 이미지

VanillaJS

Vanilla JS Toy 프로젝트 1. Form Validator - CSS편(2)

여기에 올라온 모든 프로젝트와 소스코드는 here 여기서 확인할 수 있다. vanilla javascript Toy project 1. Form Validator css는 정리할 내용이 많아서 부득이하게 나눠서 글을 올릴것 같다. 이번 글로 css는 끝내고 다음 글에서는 javascript를 어떻게 구성할지 알아보자. 이번 글에서 소개할 내용은 다음과 같다. flex container 내부 설정 css의 box layout에 있는 margin과 padding 조절 각 요소의 위치 설정 1. flex container 내부 설정 flex container에서는 주 축이 지나가는 크기를 설정할 필요가 없다. 왜냐하면 container에 들어있는 element들의 padding, margin과 같은 box l..

2022.01.07 게시됨

Codeforces Round #753 (Div. 3) A부터 D까지 업솔빙 포스팅 썸네일 이미지

알고리즘/codeforces

Codeforces Round #753 (Div. 3) A부터 D까지 업솔빙

Codeforces Round #753 (Div. 3) A부터 D까지 업솔빙 이번 대회에는 DIV. 3답게 C번까지 풀었지만 D번은 못풀었는데, 내가 마지막에 제출한 틀린 코드에서 pair에 정렬 순서만 바꾸면 풀리는 문제라서 이제는 D번을 풀 수 있는 단계까지 눈앞에 이르렀다. E번 문제는 빡 구현문제인데 원래라면 업솔빙 했어야 하지만 codefore와 atcoder에서 내가 당장 배워야 하는 것은 dp, greedy, constructive, math, implementation, number theory 이기 때문에 pass했다. 이번 대회에서 배운 것은 규칙을 찾는 문제에서는 문제가 하라는 대로 일단 처음 10개항은 써보기 잘 모르겠어도 끝까지 포기하지 말기 접근법이 잘못된 것 같으면 과감히 방향..

2022.01.07 게시됨

Vanilla JS Toy 프로젝트 1. Form Validator - CSS편(1) 포스팅 썸네일 이미지

VanillaJS

Vanilla JS Toy 프로젝트 1. Form Validator - CSS편(1)

여기에 올라온 모든 프로젝트와 소스코드는 here 여기서 확인할 수 있다. vanilla javascript Toy project 1. Form Validator 저번 글까지 해서 웹 페이지의 기본틀을 만들었으니 이번에는 CSS를 다뤄볼 차례이다. CSS는 생각보다 알아야할 내용이 많은데, 갑자기 우리보고 "디자인 해보세요"하고 던져놓으면 제일 무엇을 해야할지 막막한 분야라고 생각한다. 그래서 프로젝트를 설명하는 글을 쓸때는 내가 처음 배워서 잘 모르겠거나 알아두면 좋을 것들을 일일이 설명하면서 천천히 나아갈 예정이다. 1. body 이전에 적용하는 전처리 css는 여러 선택자 형태를 가지고 있다. 선택자란 특정 요소들을 선택하게 해주는 문법이라고 생각하면 된다. 이 선택자를 통해서 특정 요소들을 선택해..

2022.01.03 게시됨

Codeforces Round #752 (Div. 2) A부터 D까지 업솔빙 포스팅 썸네일 이미지

알고리즘/codeforces

Codeforces Round #752 (Div. 2) A부터 D까지 업솔빙

Codeforces Round #752 (Div. 2) A부터 D까지 업솔빙 이번 대회에는 B번 1100 난이도까지 풀었지만 C번부터는 못풀었는데, 이 문제는 푸는 방법까지 알았는데 단 한가지 문장때문에 1시간을 뇌절하다가 못풀었다. 내가 푼 방식을 C번문제에서 설명할텐데, 내가 처음에 푼 코드와 정답 코드를 보면 이게 왜? 틀리지? 라는 생각을 이 글을 읽고 있는 사람 또한 알게 될 것이다. 마지막 D번 문제는 단순한 코드포스식 정수론이라서 업솔빙 할 것이다. 이번 대회에서 배운 것은 XOR연산과 홀수 짝수 반복 학습 최소공배수와 최대공약수, 그리고 배수 약수 찾기 알고리즘 break문의 위험성 수직선에서 나머지 연산의 기하학적 의미 A. Era (*800) 접기/펼치기 문제 설명 소호는 정수 $a_1..

2022.01.02 게시됨