Astro新前端框架首次体验

Astro新前端框架首次体验

1、什么是Astro

Astro是一个静态网站生成器的前端框架,它提供了一种新的开发方式和更好的性能体验,帮助开发者更快速地构建现代化的网站和应用程序。

简单来说就是:Astro这个是一个网站生成器,可以直接通过提供的模版进行下载想要的网站模版,比如一般官网下载信息网站或者博客网站。

2、Astro特点

Astro还支持多种前端框架,包括React、Vue和Svelte等。开发者可以根据自己的喜好和需求选择合适的框架来开发网站。

Astro还具有优秀的性能和开发体验。它使用了编译时渲染的技术,可以将网站预先编译成静态文件,提供更快的加载速度和更好的SEO优化。同时,Astro还提供了热重载和即时预览等功能,使得开发过程更加高效和便捷。

简单来说就是:支持其他流行的前端框架,并且性能优化也挺好,易于上手,开发人员不用浪费太多时间。

3、快速使用Astro

模版地址:Themes | Astro

1、选择一个Free的模版

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

2、查看模版详细

在这里插入图片描述

3、根据readme文件进行克隆下载安装在vscode编辑器上,查看运行

4、查看目录,找到对应需要更改数据的地方,这里是md文件,可以直接copymd文件过来,上面为标题信息

在这里插入图片描述

在这里插入图片描述

到这里就基本结束了,信息更换这个项目确实基本就完成了,模版结构不用改变,也可按需求。

4、使用免费服务器netlify部署

示例:使用github登录netlify

1、将克隆下来的项目更改后上传到github

2、使用github账号登录进netlify,并且选择你的仓库项目

3、进行选择仓库项目的部署

4、部署成功即可查看在netlify上面进行部署的网站

在这里插入图片描述

通过测试,只要新修改的代码上传到github上面,通过netlify部署的网站会自动更新(会有一点延迟),非常方便,如果有自己的域名,你可以换成你自己的域名。

到此,第一次使用和测试成功,这个前端框架在特定使用的场景感觉还是非常实用的,比如一般官网摸样、个人博客、下载网站等。世界很大,我想去看看。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/866795.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

代码随想录训练营Day59

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 前言一、比较含退格的字符串 前言 提示:这里可以添加本文要记录的大概内容: 今天是跟着代码随想录刷题的第59天,今天最后一天复…

DisFormer:提高视觉动态预测的准确性和泛化能力

最新的研究进展已经显示出目标中心的表示方法在视觉动态预测任务中可以显著提升预测精度,并且增加模型的可解释性。这种表示方法通过将视觉场景分解为独立的对象,有助于模型更好地理解和预测场景中的变化。 尽管在静态图像的解耦表示学习方面已经取得了一…

基于SpringBoot的乐校园二手书交易管理系统

你好呀,我是计算机学姐码农小野!如果有相关需求,可以私信联系我。 开发语言 Java 数据库 MySQL 技术 SpringBoot框架 工具 Visual Studio、MySQL数据库开发工具 系统展示 首页 用户注册界面 二手图书界面 个人中心界面 摘要 乐校园…

亚马逊自动化仓储繁忙的一天

早晨:准备与启动 6:00 AM - 系统启动 自动化仓储系统在清晨开始启动,操作员检查各项系统和设备的状态,确保所有机器人、传送带和扫描设备都正常运行。仓储管理系统(WMS)加载当天的订单数据,准备开始处理。 6:30 AM - 早班员工到达 早班员工到达仓库,换上工作服和安全装…

Qt提升控件失败的解决办法

在 Qt Creator 中,通常是可以通过继承已有的类来创建新的子类的。如果您想要将 QGraphicsView 提升为新建的子类,可以按照以下步骤进行操作: 打开 Qt Creator,并打开您的项目。打开包含 QGraphicsView 的头文件(例如 …

go Channel原理 (四)

Channel 设计原理 不要通过共享内存的方式进行通信,而是应该通过通信的方式共享内存。 在主流编程语言中,多个线程传递数据的方式一般都是共享内存。 Go 可以使用共享内存加互斥锁进行通信,同时也提供了一种不同的并发模型,即通…

试用笔记之-VB微信支付支付宝支付源代码

首先下载VB微信支付&支付宝支付源代码 http://www.htsoft.com.cn/download/VB6WeiXin_ZhiFuBao_ZhiFu.rar

Docker国内可用镜像源

近期因为特殊原因国内可以的镜像源都挂了,找到了一个目前可使用的。 打开终端,设置 registry mirror [rootbogon debian_nginx_php7133]# cat /etc/docker/daemon.json {"registry-mirrors": ["https://dockerhub.icu"] } 您在 /…

引用个数为什么会影响内存泄漏 c++例子

在C++中,内存泄漏通常与手动管理内存有关,而不是直接由引用计数引起,因为C++标准库本身并不提供自动的引用计数功能。但是,我们可以通过一个例子来间接说明引用(或指针)管理不当如何导致内存泄漏,尤其是当涉及复杂对象结构和所有权关系时,这种管理不当往往体现在循环引…

【一念发动便是行】念头,就是命运

一个个恶念累积就是负能量,念头就是命运,克除恶念,防范念头,念头都有能量,学圣学须内外庄严检肃,言语有灵 多数人的问题都是出在念头上,念头,就是自己的命运; 当我们对自…

Linux--信号(万字详解!超完整!)

目录 0.预备知识 0.1.基本概念 0.2.信号的捕捉 0.3.理解信号的发送与保存 1.信号的产生(阶段一) 1.通过kill命令,向指定进程发送指定的信号 2.通过终端按键产生信号:ctrlc(信号2),ctrl\(…

【python】PyQt5控件尺寸大小位置,内容边距等API调用方法实战解析

✨✨ 欢迎大家来到景天科技苑✨✨ 🎈🎈 养成好习惯,先赞后看哦~🎈🎈 🏆 作者简介:景天科技苑 🏆《头衔》:大厂架构师,华为云开发者社区专家博主,…

ACID及事务隔离级别

2)ACID及事务隔离级别 ACID四大特性解释 原子性(Atomicity):一个事务内的操作,要么全部成功,要么全部失败。一致性(Consistency):数据库从一个一致性状态,转移…

第十二章 执行引擎

一、执行引擎概述 概述 执行引擎是 Java 虚拟机核心的组成部分之一。“虚拟机”是一个相对于“物理机”的概念,这两种机器都有代码执行能力,其区别是物理机的执行引擎是直接建立在处理器、缓存、指令集和操作系统层面上的,而虚拟机的执行引…

使用docker创建nginx容器部署前端项目

一、docker部署nginx服务 1、创建本地文件 本地创建nginx文件夹,并在其下创建www、config、logs三个文件夹 2、docker拉取nginx镜像 docker pull nginx 3、创建nginx容器 docker run -d --name nginx -p 8088:80 nginx 4、将nginx.conf容器配置拷贝到本地创建…

AlmaTech股份有限公司如何通过有效的营销本地化解锁全球市场

在当今全球化经济中,企业必须调整营销策略,以引起不同地区不同受众的共鸣。营销本地化,包括定制营销材料以满足各种市场的文化、语言和监管要求,对于实现这一目标至关重要。本案例研究探讨了领先的电子商务公司AlmaTech股份有限公…

解锁水利智慧:智慧水利的深度剖析与未来展望,探讨智慧水利如何助力水利行业实现数字化转型与智能化升级

本文关键词:智慧水利、智慧水利工程、智慧水利发展前景、智慧水利技术、智慧水利信息化系统、智慧水利解决方案、数字水利和智慧水利、数字水利工程、数字水利建设、数字水利概念、人水和协、智慧水库、智慧水库管理平台、智慧水库建设方案、智慧水库解决方案、智慧…

数据驱动下的SaaS渠道精细化运营:提升ROI的实战指南

在当今数字化转型的大潮中,SaaS(Software as a Service)企业面临着日益激烈的市场竞争。为了在市场中脱颖而出,实现可持续增长,SaaS企业必须转向更为精细化的运营模式,而数据驱动则是实现这一目标的关键。本…

GPT提示词模板

BRTR 原则 # 背景(Background) - 描述任务的背景信息,包括任务的起因、目的、相关的历史信息或当前状况。 - 提供足够的背景信息以便让ChatGPT理解任务的上下文。 # 角色(Role) - 定义ChatGPT在任务中所扮演的角色&…