이 글에서는 웹 개발자가 꼭 알아야 할 2018년 기술 동향 분석을 주로 공유합니다. 웹 개발자는 프론트엔드든 백엔드든 항상 기술에 대한 민감성을 유지해야 합니다. 기술이 대중화되려면 어느 정도 시간이 걸립니다. 2018년 웹 개발에서 새로운 인기를 끌 수 있는 웹 관련 기술은 무엇입니까? 아래 목록은 업계에서 실행되어 왔으며 일반적으로 대기업에서 선호하거나 권장하는 기술입니다.
"프로그레시브 웹 앱"은 웹사이트 방문 시 로컬 앱을 방문하는 것과 동일한 경험을 제공할 수 있습니다. 이 기술은 원래 Google이 2015년에 제안한 것입니다. 프로그레시브 웹 앱은 웹과 로컬 앱의 장점을 결합합니다. PWA Rocks에서 프로그레시브 웹 앱의 모습을 확인할 수 있습니다.
Progressive Web App의 가장 큰 장점 중 하나는 안정성입니다. 백그라운드에 "서비스 워커"가 추가되어 빠른 로딩, 오프라인 또는 네트워크 환경이 극도로 열악할 때 사용, 동기 업데이트 등을 수행할 수 있습니다. PC 데스크탑, 모바일 단말기, 태블릿 또는 미래의 새로운 장치를 포함하되 이에 국한되지 않는 장치에서 반응적으로 실행될 수 있기 때문에 "프로그레시브"라고 합니다. 백그라운드의 서비스 워커는 네트워크 요청을 가로채고 Progressive Web App의 전송 프로토콜이 "HTTPS"인지 확인할 수 있으므로 애플리케이션의 보안을 보장할 수 있습니다.
Alibaba는 200개 이상의 국가에 서비스를 제공하는 세계 최대 온라인 B2B 회사입니다. 웹사이트를 개발할 때 사용자 경험이 가장 중요한 고려 사항이 될 것입니다. 알리바바의 웹사이트는 모바일 경험에 대한 고객의 요구를 충족시키기 위해 '모바일 웹'과 '모바일 앱' 개발에 동시에 초점을 맞춰야 합니다. 그러나 그렇게 하는 것이 사용자 경험을 극대화하는 최선의 방법이 아니라는 것을 깨달았습니다. 웹 및 앱 개발에는 모바일 측면에서 동일한 요구 사항을 충족하기 위해 두 배의 리소스가 필요했습니다. 동시에 웹은 인터넷과 강력하게 통합되어 오프라인으로 사용할 수 없습니다. 앱 개발 주기가 길고 사용자의 빈번한 업데이트가 필요합니다. 따라서 알리바바의 웹사이트도 PWA를 선택했고, 웹사이트의 76%가 PWA로 전환됐다. Alibaba PWA를 사용해 보고 싶다면 휴대전화의 Chrome에서 Alibaba 공식 웹사이트에 접속하여 판매자 푸시 알림, 애플리케이션 사용자 정의 시작 인터페이스 등을 지원할 수 있습니다. 이는 실제로 브라우저에 로컬 앱이 있는 것과 동일한 경험입니다.
현재 점점 더 많은 웹사이트가 검색의 단순성과 속도에 중점을 두고 있으며, 점점 더 많은 단일 페이지 웹 애플리케이션을 보게 될 것입니다. 소위 단일 페이지 웹 애플리케이션은 Html 페이지와 긴 스크롤 막대만 포함하는 웹 사이트를 의미합니다. 단일 페이지 웹 애플리케이션 "Magic Interactive Resume"을 살펴보겠습니다.
단일 페이지 웹 애플리케이션에는 많은 장점이 있습니다. 모든 콘텐츠가 하나의 웹 페이지에 표시되며 사용자가 선형적으로 탐색하는 시기를 제어할 수 있습니다. 웹사이트 웹사이트 정보 흐름. 이러한 종류의 제어를 사용하면 스크롤 막대가 스크롤되는 동안 사용자의 여정을 안내할 수 있습니다. 동시에 이를 통해 방문자는 통합된 입구를 통해 참여할 수 있으며, 이야기를 들려주고, 관점을 보여주고, 경험을 시뮬레이션할 수 있습니다.
단일 페이지 웹 애플리케이션은 단순성과 효율성을 추구하고 모바일 단말기를 지원하며 사용자 친화적인 인터페이스를 갖추고 변환이 매우 편리합니다. 그러나 전자상거래 애플리케이션에는 적합하지 않습니다.
이제 콘텐츠 관리 시스템(콘텐츠 관리 시스템) 분야는 동적 웹사이트가 지배하고 있습니다. 그러나 인터넷에 처음 등장한 사이트는 정적인 사이트였습니다. 이제 정적 웹 사이트 생성기의 도움으로 정적 웹 사이트가 다시 돌아왔습니다. 이는 웹 개발에 대한 하이브리드 접근 방식입니다. Jekyll은 가장 인기 있는 정적 웹사이트 생성기 중 하나입니다.
정적 웹사이트 생성기 또는 정적 웹사이트 엔진은 동적 콘텐츠와 데이터를 입력으로 사용하고 배포 가능한 정적 파일(HTML, CSS, JavaScript)을 출력합니다. 서버 측 언어 및 데이터베이스는 관련되지 않습니다. 이러한 정적 사이트는 더 빠르고 안정적이며 저렴하거나 심지어 무료이며 배포 및 버전 관리가 쉽습니다. 웹사이트에는 서버측 언어와 데이터베이스가 포함되어 있지 않기 때문에 웹사이트의 보안도 더욱 강화됩니다.
Jekyll, Hugo, GitBook 및 Pelican은 현재 가장 인기 있는 정적 블로그 생성기입니다. 또한 StaticGen을 방문하여 더 많은 오픈 소스 정적 웹사이트 생성기를 찾아볼 수도 있습니다.
아방가르드한 웹사이트나 앱에서 배경 애니메이션, 페이지 전환 애니메이션, 스크롤 막대 스크롤 애니메이션 또는 애니메이션 테이블과 같은 효과를 본 적이 있을 것입니다. 이러한 복잡한 애니메이션 뒤에는 Motion UI가 있습니다. 먼저 Tubik의 멋진 효과 예제 명함 앱 디자인을 살펴보겠습니다.
Motion UI는 원래 유연한 CSS 전환 및 애니메이션 효과를 만들기 위해 2014년 12월에 출시된 Zurb Foundation APP에 포함된 종속성 패키지였습니다. 2016년에 Zurb 팀은 몇 가지 새로운 기능을 추가하고 공식적으로 독립 라이브러리로 출시했습니다. Motion UI CSS 스타일의 최신 버전은 모든 JS와 호환되므로 애니메이션을 웹과 원활하게 통합할 수 있습니다.
사이트에 모션 UI 요소를 추가하면 사용자 참여와 사용량이 크게 늘어날 수 있습니다. Motion UI 사용법을 배우는 데 도움이 되는 사이트인 UI Movement를 방문하세요.
인스턴트 메시징 도구를 사용해 본 적이 있다면 챗봇과 채팅을 해보셨을 것입니다. 'Facebook Messager'에만 10,000개 이상의 챗봇이 있습니다. ChatBot은 대화형 인터페이스(예: 인스턴트 메시징 앱 WeChat)를 통해 애플리케이션 상호 작용을 가능하게 하는 서비스입니다. 이 서비스는 온라인 쇼핑, Uber 차량 서비스 주문, 뉴스 홍보, 생활 조언 제공에 도움이 될 수 있습니다. 일기예보 챗봇 판초 입니다.
챗봇은 엄청난 비즈니스 가치와 잠재력을 가지고 있습니다. 본 챗봇 포털을 통해 다양한 서비스를 받으실 수 있습니다. 인공지능의 등장으로 챗봇은 기업의 운영 방식을 크게 변화시킬 수 있습니다. 외국 기업인 Octane AI와 Drift는 이를 깨닫고 이 분야의 플랫폼을 구축하기 시작했습니다.
WeChat 미니 프로그램은 2017년 9월에 공식 출시되었습니다. 다운로드나 설치가 필요 없는 애플리케이션으로, 사용자는 스캔이나 검색을 통해 애플리케이션을 열 수 있습니다. 먼저 애플리케이션의 역사적 변화를 검토해 보겠습니다.
WeChat 애플릿이 이 역사에 등장했습니다.
PC 데스크톱 프로그램 C/S 조직
PC 브라우저 프로그램 B/S 구조
모바일 APP C/S 구조
Mobile H5 미니 프로그램 B/S구조 챗봇?
IOT 시대 B/S 구조 ?
소형 프로그램의 특징: 설치 필요 없음, 사용 후 바로 실행, 진입 없음, 트리거 포인트 트리거. 본질적으로 이는 WeChat(운영 플랫폼과 서비스 플랫폼을 통합)에서 실행되는 H5 프로그램일 뿐입니다. APP에서 미니 프로그램으로의 전환은 "CS"에서 "BS" 구조로의 전환일 뿐입니다. PC시대.
사물인터넷(IoT) 시대를 맞이하는 미니프로그램의 시도는 2018년 성공할 수 있을까? 서구의 대규모 챗봇이나 중국의 위챗 애플릿이 다음 IOC 시대에도 성공적으로 활용될 수 있을지는 두고 볼 일이다.
관련 추천 :
2017년 한 눈에 볼 만한 자바스크립트 관련 기술 동향