본문 바로가기

2020/079

프론트엔드 면접 문제은행에 대한 정리(2) 프론트엔드 면접 문제은행 제 2탄입니다. 선호하는 개발 환경에 대해 자유롭게 이야기해 주세요. 제가 선호하는 개발 환경은 javascript 환경을 선호합니다. 자유분방한 javascript를 컴파일해서 사용하는 타입스크립트도 좋아합니다. 자바스크립트의 자유분방에 절제미를 더할 수 있는 상황에는 타입스크립트로 충분하다고 생각합니다. DB는 설계를 자세히 해보진 않았지만 RDBMS 든 NOSQL이든 Select를 잘 해올 수 있으면 된다고 생각합니다. IDE는 자바 등 컴파일 언어에서는 인텔리제이를 선호하고, 나머지 국면에서는 VSCODE를 선호합니다. 그리고 SPA를 만들 수 있는 환경 PWA로 데스크탑 애플리케이션을 만들 수 있었으면 좋겠습니다. 버전 관리 시스템은 어떤 것들을 사용해보셨습니까? 현재 .. 2020. 7. 30.
프론트엔드 면접 문제은행에 대한 정리(1) 일반적인 질문: 어제/이번 주에 무엇을 공부하셨나요? 어제는 자바스크립트로 slide를 순수하게 만드는 작업을 코드펜에서 시도해보았고, 이번 주에는 전체적으로 flutter 앱을 만들기 위해 flutter 생존코딩이라는 책을 독파하며 튜토리얼을 한단계씩 끝내는 것에 주안점을 두었습니다. 코딩을 할 때 당신을 들뜨게 하거나 흥미를 끄는 것들은 무엇인가요? 저를 들뜨게 하는 것은 개발자와 서비스 제공 운영자, 즉 시스템 플랫폼적 운영자들이 저를 통하여 조금 더 빠르고 편리하게 서비스를 제공할 수 있게 되어, 그로인해 발생하는 이익창출이 된다고 생각 될 때입니다. 최근에 당신이 경험한 기술적인 문제는 무엇이고 그것을 어떻게 해결했나요? 최근에 제가 경험한 기술적인 문제는, 순수 자바스크립트로 진행되어지지 않는.. 2020. 7. 29.
[CSS 방법론] 웹 사이트 적정 수정 수준에 따른 미디어 쿼리 (feat. prefers-reduced-motion) 웹 개발을 하면서 적정 수정 수준이란 것이 있습니다. 웹에서 사람들을 위해 일을 해결하는 일을 할 기회가 있습니다. 이러한 수정의 범위가 얼마나 다른지에 대해 매우 흥미롭습니다. 사용자를 위한 미디어쿼리들이 많이 제공되고 있습니다. 그 중 하나는 prefers-reduced-motion라는 미디어쿼리 속성일 것입니다. 이 미디어 쿼리는 웹에서 사람들의 경험을 개선하기 위해 독점적으로 사용됩니다. 모션 감소를 명시적으로 요청한 사용자의 모션을 감소시키는 코드를 작성할 수 있습니다. @media (prefers-reduced-motion: reduce), (update: slow) { *, ::before, ::after { animation-delay: -1ms !important; animation-du.. 2020. 7. 26.
Flexbox로 text ellipsis 표현하기 HTML markup this-file-has-a-really-really-really-long-filename. pdf CSS .filename { display: flex; min-width: 0; } .filename__base { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .filename__extension { flex-shrink: 0; } - flex min-width를 0으로 설정하고 확장자는 줄어들지 않도록 flex-shirnk:0을 줍니다. - 그렇게 되면 filename 은 0까지 줄어들 수 있습니다. 출처 : https://leonardofaria.net/2020/07/18/using-flexbox-and-t.. 2020. 7. 26.