新書推薦:
《
世界巨变:严复的角色(王中江著作系列)
》
售價:HK$
110.0
《
塔西佗(全二册)(二十世纪人文译丛)
》
售價:HK$
396.0
《
(棱镜精装人文译丛)思想的假死
》
售價:HK$
63.8
《
当代精神分析新论
》
售價:HK$
94.6
《
宋初三先生集(中国思想史资料丛刊)
》
售價:HK$
217.8
《
定言命令式:康德道德哲学研究(政治哲学名著译丛)
》
售價:HK$
129.8
《
棕榈油的全球史 : 从奴隶船到购物篮
》
售價:HK$
96.8
《
简帛时代与早期中国思想世界(上下册)(王中江著作系列)
》
售價:HK$
308.0
編輯推薦:
现在,很多Web框架都要加载大量“备用\代码,造成应用程序结构杂乱、运行缓慢。Svelte 是一个对开发人员友好的创新工具,能用更少代码实现更多功能;编译后的应用程序非常小,加载时间更短。将Svelte和Sapper框架结合使用,页面路由、服务端渲染、静态页面开发将变得简单且灵活。
《Svelte和Sapper实战》一书将讲述如何设计和构建快捷、优雅的Web应用程序。你将学习如何创建Svelte组件和出色的UX,并将开发一个卓越的Travel Packing应用程序。你将掌握Svelte特有的状态管理器模型,学会使用Sapper简化页面路由,并学习现代前端领域的一些实践,如代码分割、离线支持和服务器渲染的视图。
內容簡介:
主要内容
●创建 Svelte组件
●通过store管理共享数据
●配置页面路由
●调试、测试和部署Svelte 应用程序
●使用Sapper开发动态网站和静态网站
關於作者:
R. Mark Volkmann从1996年开始就提供软件咨询和培训服务,目前是位于圣路易斯的Object Computing公司的合作人。作为一名资深的咨询顾问,Mark为很多公司提供JavaScript、Node.js、Svelte、React、Vue、Angular等方面的帮助,创建并讲授了许多课程,包括React、Vue、AngularJS、Node.js、jQuery、JavaScript、HTML5、CSS3、Ruby、Java和XML。他经常面向圣路易斯地区的用户发表演讲,并出席各种会议,包括Nordic.js、Jfokus、NDC Oslo、Strange Loop、MidwestJS、No Fluff Just Stuff和XML DevCon。Mark长期撰写各类关于软件开发的文章,这些文章收录在https://objectcomputing.com/resources/publications/mark-volkmann。
在业余时间,Mark爱好跑步,已经在39个州参加了49场马拉松比赛。
內容試閱 :
前 言
本书读者对象
《Svelte和Sapper实战》一书面向希望提升开发效率的Web开发人员。也许你一直在思考是不是有一种更简单的开发方式来开发Web应用程序。恭喜你,答案就在《Svelte和Sapper实战》。通过大量代码示例,你将学会如何使用Svelte和Sapper开发Web应用程序。
《Svelte和Sapper实战》面向的读者需要具备一些基本的HTML、CSS和JavaScript知识。
· 关于HTML,读者需要熟悉html、head、link、style、script、body、div、span、p、ol、ul、li、input、textarea和select等元素。
· 关于CSS,读者需要理解CSS语法规则,什么是CSS的“级联”,了解基本的CSS选择器(包括元素名、类名、id、继承关系),了解常用的CSS属性(包括color、font-family、font-size、font-style和font-weight)以及CSS盒模型(content、padding、border和margin)。
· 关于JavaScript,读者需要知道变量、字符串、数组、对象、函数、类、promise、解构、spread操作符、export和import。
如果你发现了关于《Svelte和Sapper实战》的任何问题,可以在网络上与我们沟通。我希望当你读完《Svelte和Sapper实战》时,能够发现Svelte和Sapper的一些与众不同的地方,并在下一个项目中尝试使用它们。
《Svelte和Sapper实战》的结构:路线图
《Svelte和Sapper实战》分为四部分,包括21章。
第Ⅰ部分介绍Svelte和Sapper。
· 第1章主要阐述Svelte和Sapper的一些过人之处,在结尾部分介绍Svelte Native,并与其他主流的Web框架进行对比。此外,还介绍开发所需的工具。
· 第2章将带你使用在线工具(REPL)创建个Svelte应用程序。通过这种在线方式构建的应用程序可以在线保存,并与他人共享代码,还可将代码导出到本地继续进行开发。此外,还介绍在本地开发Svelte应用程序的步骤。
第Ⅱ部分将深入研究Svelte,并提供大量代码示例供参考。
· 第3章介绍如何构建Svelte组件,包括其中的逻辑、标签和样式。随后介绍如何使用响应式语句以及模块上下文来管理组件状态。后,将展示一个自定义组件的示例。
· 第4章涵盖Svelte的块结构,包括条件逻辑、迭代、promise异步控制HTML标签等。{#if}实现了条件逻辑,{#each}实现了迭代遍历的功能,{#await}实现了promise异步功能。
· 第5章将带你探索组件之间的通信,包括props、双向绑定、slot、事件和上下文。
· 第6章阐述如何使用store共享组件之间的数据。store有四种类型:可读写、只读、派生和自定义。随后介绍如何使用JavaScript类创建store以及持久化store中的数据。
· 第7章展示在Svelte组件中操作DOM的几种方法,包括插入HTML,使用“动作”获得DOM元素,在Svelte重新渲染后使用tick函数手动修改DOM。后,将展示一个对话框以及实现拖曳功能的示例。
· 第8章将讲解Svelte的生命周期函数,包括onMount、beforeUpdate、afterUpdate和onDestroy。后,展示一个基于现有Svelte生命周期函数自定义新的生命周期函数的示例。
· 第9章演示为Svelte应用程序添加页面路由的三种方法:手动路由、哈希路由以及使用page.js进行路由。我们将开发一个购物应用程序来演示这三种路由。此外,还可使用Sapper实现路由,相关内容将在第16章详细介绍。
· 第10章探讨在Svelte中对于动画的有力支持,详细介绍svelte/animate、svelte/motion和svelte/transition这三个包,以及在两个列表之间移动列表元素的两种方式:一种方式使用fade过渡效果和flip动画的组合,另一种方式使用crossfade过渡效果。后讨论如何创建自定义动画以及如何使用过渡事件。
· 第11章展示如何调试Svelte应用程序。包括@debug标签、使用console方法调试响应式语句以及配套的浏览器调试插件svelte-devtools。
· 第12章演示Svelte应用程序的多种测试方法。Jest和svelte-testing-library可用来执行单元测试。端到端的测试可使用Cypress。Svelte还为可访问性提供了一些测试手段,如果你想进行额外的可访问性测试,可采用Lighthouse、axe和WAVE。后,可以使用Storybook展示和操作测试组件。
· 第13章将带你探索如何部署Svelte应用程序,包括手动部署一个HTTP服务器,以及如何使用Netlify、VercelNow和Docker。
· 第14章主要介绍Svelte的其他一些知识点,包括表单验证、CSS变量、使用“特殊元素”创建Svelte组件库,以及利用Svelte组件生成Web Components。
第Ⅲ部分将深入研究Sapper。Sapper是一个基于Svelte的Web应用程序开发框架。
· 第15章将使用Sapper重构第9章中的购物应用程序,这将是你的个Sapper应用程序。
· 第16章将全面介绍Sapper。首先介绍Sapper应用程序的结构,之后是Sapper的一些功能,包括页面路由、页面布局、预加载、预请求以及代码分割。
· 第17章将探索Sapper的服务器路由,通过服务器路由,我们的项目就不仅是Web应用程序的客户端了,还具备了提供API服务的能力。你将学会创建、查询、更新、删除(CRUD)等一系列服务是如何实现的。
· 第18章展示如何将Sapper应用程序部署成一个静态站点。对于那些采用HTML作为页面展示载体的应用程序来说,这非常有用。后,将带你一起实现一个类似的应用程序,其中包括两个页面,一个是石头剪刀布的游戏,另一个是我家的狗。
· 第19章描述如何使用service worker实现Sapper的离线功能。将介绍以下内容:多种缓存策略;Sapper内置service worker的一些细节,包括install、activate和fetch等service worker事件;如何启用HTTPS。后,带你一起体验Sapper的离线功能是如何发挥作用的。
第Ⅳ部分将不局限于Svelte和Sapper。
· 第20章将带你探索对于高级语法的预处理技术,包括Sass、TypeScript和Markdown,并提供这些预处理技术对应的示例。
· 第21章将介绍Svelte Native以及如何使用Svelte和NativeScript来开发Android端和iOS端的移动应用程序。我们将利用REPL创建两个在线的Svelte Native应用程序,使用REPL的好处是并不需要在计算机中安装任何软件。同时将提供一个示例来详细解释显示、表单、动作、对话框、布局和导航等组件的实现细节,以及如何为Svelte Native组件添加样式。后,介绍NativeScript UI组件库,并使用其中的组件RadSideDrawer创建一个示例应用程序。
后一章结束后我们的学习并没有告一段落!还有七个附录在等着你。
· 附录A整理与Svelte、Sapper和Svelte Native相关的资料的链接。
· 附录B介绍如何使用Fetch API请求REST服务。
· 附录C介绍在第17章中使用过的MongoDB数据库。
· 附录D介绍如何配置和使用ESLint来检查应用程序中的问题。
· 附录E介绍如何配置和使用Prettier来格式化Svelte和Sapper应用程序中的代码。
· 附录F介绍在使用VS Code开发Svelte和Sapper应用程序时所用到的几种插件。
· 附录G介绍如何使用Snowpack构建Svelte应用程序。Snowpack与传统的编译工具(如Webpack、Rollup和Parcel)相比,是一种更高效的构建Web应用程序的工具。
在《Svelte和Sapper实战》中,我们将开发一个Travel Packing应用程序。《Svelte和Sapper实战》中的大部分章节都围绕这个应用程序展开讨论,并以它为基础添加对应的功能。
对于Svelte新手来说,应该首先按照顺序读完《Svelte和Sapper实战》的第1~8章,这八章涵盖了Svelte的核心理念。之后可以根据兴趣和需要有选择地进行阅读。当然,如果你有使用Svelte的经验,那么可以根据兴趣从《Svelte和Sapper实战》的任何章节开始阅读。
关于代码
可扫描封底二维码来下载相关代码。
《Svelte和Sapper实战》中包含了很多用于演示的源代码,既有通过编号列举出来的,也有与正文混排在一起的。上述两种源代码会被格式化为等宽字体。有一些代码还会被特意加粗以强调其与之前章节中代码的区别,比如当为之前的代码添加一段新功能,新功能的代码就会被加粗。
有些情况下,源代码已经被重新格式化过了;为适应《Svelte和Sapper实战》印刷的排版,额外增加了换行符,并重新设计了缩进。然而在极少数情况下,换行符和缩进也无法解决排版混乱的问题,为此会增加续行标记(?)来调整排版。此外,代码的注释会被从代码清单中删除,而是在代码清单外的其他地方标注出来,以强调注释的重要性。
其他在线资源
附录A列出了一系列在线资源。其中的大多数都与Svelte和Sapper有直接关系,但也有一些涵盖了适合于所有Web开发的内容。
关于彩图
正文中有时提到界面颜色,由于《Svelte和Sapper实战》是黑白印刷,将无法显示彩色。请读者在实际操作过程中从计算机屏幕上查看;另外,也可扫描封底二维码下载彩图。