프론트엔드
-
Next.js Version 11 업데이트 사항 정리개발 블로깅/Next.js 2021. 6. 19. 16:58
21년 6월 16일에 Vercel에서 Next.js의 버전11 업데이트된 사항에 대해 공개했다. perfomance 최적화 이런건 물론이고(?), Conformance랑, Image 최적화 관련, Webpack5 관련 요소들이 새롭게 업데이트 됐다..🙌 Next.js가 갈수록 SEO 전용 프레임워크로 거듭나는 것 같다. 웹 바이탈(Web vital) 개선 요소들을 계속해서 공략해 나아가는 느낌이다. 업데이트 사항 Conformance: 최적의 UX를 제공할 수 있는 최적화된 솔루션을 제공하는 시스템 Improved Performance: Cold Start up Time(Next.js 빌드 및 실행할 때 걸리는 시간?) 최적화. `next/script`: 성능 향상을 위한 third-party 우선순위 ..
-
[2021.01.09] 시각적 요소의 중요성을 보여준 서비스 '타입캐스트'핵인싸 개발자의 길 2021. 1. 9. 15:38
최근 흥미로운 서비스 하나를 알게 되었다. 서비스를 둘러보면서 기술이나 사업성도 꽤 좋아 보였고, 특히나 프론트엔드 개발자로서 시각적인 요소에 대해 생각해볼 수 있는 계기가 되어서 가볍게 소개해 보려고 한다. 먼저 서비스를 소개하자면, 음성AI 기술로 텍스트 대본을 대신 읽어주는 타입캐스트라는 서비스이다. 작성한 텍스트를 인식하고 실제 사람이 말하는 듯 소리를 내어 읽는다. 물론 목소리 톤 높낮이나 말투 등 세부적인 설정이 가능해서 여러 가지 자연스러운 음성을 만들어낼 수 있다. 처음에는 이러한 서비스의 사업 방향성과 기술로만 봤을땐 운영하는 홈페이지가 약간 아래와 같은 느낌일 줄 알았다. 내가 생각했던 보통의 AI 서비스 홈페이지 위 이미지들과 같이, 일반적인 IT 스타트업의 렌딩 페이지 느낌. 웹 페..
-
[2020.08.04] 브라우저 동작원리개발 블로깅/기타 개념 2020. 8. 4. 18:20
현재 정보화 사회에 이제는 없어서는 안 될 프로그램. 프론트엔드 개발자라면 무조건 다룰 수밖에 없는 도구이자, 끝없는 정보 바다에 접속하기 위한 필수 도구. 웹 브라우저. 우리가 평소에 접하는 이 화면은 도대체 어떻게 나타나게 되는 것일까? 우리는 평소처럼 당연하게 인터넷 주소창에 주소를 입력하고 거기에 해당되는 홈페이지 화면을 접하며 사이트를 돌아다니기만 했지, 이렇게 화면이 보여지는 과정이 어떻게 동작하는지는 생각해보지 못했을 것이다. (사실 그렇게까지 생각해 볼 필요도 없겠지만...) 프론트엔드 개발자 역시, HTML과 CSS 문서를 작성하고 Javascript 코드를 짜면서 기대하던 동작을 확인하며 웹 개발을 했을 것이고, 실제로 이 HTML문서가 어떻게 자리를 잡아서 웹 페이지에 각자 자리에 D..
-
트레바리 온라인 커뮤니티 활성화를 위한 프로필 페이지 및 아키텍처 구현 과정핵인싸 개발자의 길/트레바리 활동(2019.8~2020.07) 2019. 11. 12. 22:36
안녕하세요. 트레바리 테크 셀 크루 이뇽입니다. 이번에 트레바리 서비스에서, 각 멤버(유저)들이 자신을 소개할 수 있도록 '프로필 페이지' 기능을 구현하였습니다. 트레바리는 현재 독서모임 기반으로 엄청나게 활발한 커뮤니티 활동이 열리고 있습니다. 한 달에 한 번 정규 독서모임과 제한 없는 번개모임, 그리고 엄청나게 다양한 이벤트도 참여할 수 있는데요. 저희 트레바리에서는 이러한 오프라인 커뮤니티 활동에 그치지 않고, '세상을 더 지적으로, 사람들을 더 친하게' 만들기 위해서 온라인 커뮤니티까지 더 활성화하고자 하는 방안을 모색하였습니다. 현재 트레바리 서비스에서 할 수 있는 커뮤니티 활동은 독서모임 서비스에 알맞게, 독후감 제출과 해당 독후감 '댓글', '좋아요' 기능으로 구성되어 있고, 앞으로 더욱 온..
-
[2019.08.04] PWA(Progressive Web App)이란?개발 블로깅/기타 개념 2019. 8. 4. 16:25
PWA(Progressive Web App)이란, 네이티브 앱과 웹의 장점을 합친 프론트엔드 개발 환경이다. # 웹의 특징(장,단점) 앱 설치과정 없이 URL 접속으로, 서비스 진입장벽이 낮다. 실시간 컨텐츠 업데이트 환경을 갖추고 있다. ----------------------------------------- 실행 구동이 앱보다 퍼포먼스가 떨어진다. 푸쉬알림과 같은 백그라운드 동작을 할 수 없다. 오프라인 구동이 불가능하다. # 앱의 특징(장,단점) 실행구동이 원활하다. 백그라운드 동작이 가능하다. 오프라인 구동이 가능하다. ------------------------------------------ 처음 앱 설치과정이 있어, 진입장벽이 크다. 컨텐츠 최신화 환경이 웹보다 떨어진다. # PWA 특징 ..