분류 전체보기 검색 결과

해당 글 73건

자바스크립트의 비동기 처리와 콜백, Promise

서론 emoji-minesweeper의 코드 분석을 하던 중, serviceworker를 이해하기 위해 배경지식의 일환으로써 자바스크립트의 비동기 처리 방식, 콜백 함수, 프로미스 전반에 대해 공부하고 정리하였다. 각 페이지들에서 작성된 코드들은 실제로 작동하지 않은 가상의 도메인을 두고 get 요청을 보내거나, 관례적으로 settimeout 등의 코드만을 실행하는 경우가 많았기 때문에, 최대한 실제 존재하는 도메인으로 실제 동작하는 예제 코드를 새로 작성하였다. 비동기 처리 Promise를 본격적으로 이해하기 이전, 우선 자바스크립트의 비동기 처리에 대해 이해할 필요가 있다. 비동기 처리는 요청에 대한 응답을 기다리지 않고 다음 코드를 실행하는 처리 방식이다. 비동기 처리의 가장 흔한 사례는 ajax ..
웹 2019. 12. 14. 21:02

emoji-minesweeper 코드 분석 일지 day 1

어떻게 공부해야 할까? 책도 거의 다 읽어 가고, 구상하고 있는 토이 프로젝트의 개발을 시작하고 싶은데, 내가 지금 배운 것만으로 충분한가? 라는 의문이 들었다. 그래서 다른 사람들은 어떻게 공부하는지 찾아보았다. 신입 개발자의 개발력을 높이는 방법은? 어쩌다보니 오픈 소스 컨트리뷰터가 되었습니다? 오픈소스 컨트리뷰터? 말만 들어봤지 내가 과연 할 수 있을까 라는 생각이었다. 일단 자신감이 없었다. 저렇게 크고 거대한 소스코드들에 내가 기여할 수 있을까? 저 소스코드들을 이해할 자신도 없는데? 그렇지만 얼마전부터 바꾸기로 한 사소한 것이 있다. 일단 가 보자. 그래서 어떻게 갈 것인지에 대한 조언을 얻었다. 1. 일단 잘 쓰여진 간단하고 작은 코드를 읽어보고 분석한다. 2. 분석한 코드를 다른 언어로 포..
시행착오들 2019. 12. 3. 15:38

7.6 팬미팅

문제 가장 멤버가 많은 아이돌 그룹으로 기네스 북에 올라 있는 혼성 팝 그룹 하이퍼 시니어가 데뷔 10주년 기념 팬미팅을 개최했습니다. 팬미팅의 한 순서로, 멤버들과 참가한 팬들이 포옹을 하는 행사를 갖기로 했습니다. 하이퍼시니어의 멤버들은 우선 무대에 일렬로 섭니다. 팬미팅에 참가한 M명의 핸들은 줄을 서서 맨 오른쪽 멤버에서부터 시작해 한 명씩 왼쪽으로 움직이며 멤버들과 하나씩 포옹을 합니다. 모든 팬들은 동시에 한 명씩 움직입니다. 남성 멤버와 남성 팬이 만났을 때는 포옹 대신 악수를 합니다. 줄을 선 멤버들과 팬들의 성별이 각각 주어질 때 팬미팅이 진행되는 과정에서 하이퍼시니어의 모든 멤버가 동시에 포옹을 하는 일이 몇 번이나 있는지 계산하는 프로그램을 작성하시오. 입력 첫 줄에 테스트 케이스의 ..
알고리즘 2019. 12. 3. 11:52

7.4 울타리 잘라내기

문제 너비가 같은 N개의 나무 판자를 붙여 세운 울타리가 있습니다. 시간이 지남에 따라 판자들이 부러지거나 망가져 높이가 다 달라진 관계로 울타리를 통째로 교체하기로 했습니다. 이때 버리는 울타리의 일부를 직사각형으로 잘라내 재활용하고 싶습니다. 울타리를 구성하는 각 판자의 높이가 주어질 때, 잘라낼 수 있는 직사각형의 최대 크기를 계산하는 프로그램을 작성하세요. 단, 직사각형을 비스듬히 잘라낼 수는 없습니다. 판자의 너비는 모두 1이라고 가정합니다. 시간 및 메모리 제한 프로그램은 1초 안에 실행되어야 하며, 64MB 이하의 메모리를 사용해야 합니다. 입력 첫 줄에 테스트 케이스의 개수 C(C
알고리즘 2019. 12. 3. 11:52

7.2 쿼드 트리 뒤집기

대량의 좌표 데이터를 메모리 안에 압축해 저장하기 위해 사용하는 기법 중 하나 —> 쿼드 트리 (quad tree) 주어진 공간을 항상 4개로 분할해 재귀적으로 표현하기 때문에 쿼드 트리라는 이름이 붙음. 문제 쿼드 트리로 압축된 흑백 그림이 주어졌을 때, 이 그림을 상하로 뒤집은 그림을 쿼드 트리 압축해서 출력하는 프로그램을 작성하세요. 시간 및 메모리 제한 프로그램은 1초 안에 실행되어야 하며, 64MB 이하의 메모리를 사용해야 ㅎ바니다. 입력 첫 줄에 테스트 케이스의 개수 C(C는 50보다 작거나 같음)가 주어집니다. 그 후 C줄에 하나씩 쿼드 트리로 압축한 그림이 주어집니다. 모든 문자열의 길이는 1,000 이하이며, 원본 그림의 크기는 2^20 * 2^20 을 넘지 않습니다. 출력 각 테스트 케..
알고리즘 2019. 12. 3. 11:51

ARIA

깃허브의 emoji-minesweeper 코드를 분석하다가 aria-live, aria-haspopup, …와 같은 속성 태그들이 등장해서, 무엇인지 찾고 정리하였다. Accessible Rich Internet Applications —> 접근 가능한 리치 인터넷 어플리케이션 웹 콘텐츠와 웹 어플리케이션 (그 중에서도 특히 Ajax와 Javascript를 사용하여 개발한 것들)을 제작할 때 적용할 수 있는 장애인을 위한 접근성 향상 방법을 정의 웹툰/웹소설 플랫폼인 레진에서도 WAI-ARIA 명세를 적용하고 있는데, 레진 기술 블로그에서 설명하는 적용 배경은 다음과 같다. “ 페이지를 새로고침하지 않고 콘텐츠를 Ajax 방식으로 갱신했을 때 전맹 시각장애인은 어떤 응답을 받을 수 있을까? 갱신 사실을 ..
웹 2019. 12. 2. 19:40