> For the complete documentation index, see [llms.txt](https://mixdao.gitbook.io/dfinity/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://mixdao.gitbook.io/dfinity/san-shou-ba-shou/5.-tian-jia-qian-duan-zi-yuan.md).

# 5.添加前端资源

教程介绍了一些为项目构建前端用户界面的基本方法。 例如，这些教程演示了：‌

* 使用[Candid](https://sdk.dfinity.org/docs/developers-guide/tutorials/hello-location.html#candid-ui)作为基本界面来公开和测试Canister中的功能。
* 使用[原始JavaScript](https://sdk.dfinity.org/docs/developers-guide/tutorials/explore-templates.html#default-frontend)显示简单的弹出警报窗口。
* 使用[React和已编译的JavaScript](https://sdk.dfinity.org/docs/developers-guide/tutorials/custom-frontend.html)将HTML属性和元素直接嵌入页面中。
* 使用[React和TypeScript](https://sdk.dfinity.org/docs/developers-guide/tutorials/my-contacts.html)从外部文件导入CSS属性。

‌

本节将仔细研究默认的前端模板，前端配置选项，以及使用其他框架为您的项目构建用户界面。<br>