120 lines
3.6 KiB
Markdown
120 lines
3.6 KiB
Markdown
# Astroship - Astro Starter Template 🛸
|
|
|
|
Astroship is a starter template for startups, marketing websites & landing pages. Built with Astro, TailwindCSS & Alpine.js.
|
|
|
|
This Free Template is sponsored by [Web3Templates](https://web3templates.com)
|
|
|
|
## Live Demo
|
|
|
|
### [https://astroship.web3templates.com/](https://astroship.web3templates.com/)
|
|
|
|
### [Download Astroship Template](https://web3templates.com/templates/astroship-starter-website-template-for-astro)
|
|
|
|
## Deploy on Vercel
|
|
|
|
Click the below link to deploy this template on Vercel
|
|
|
|
[](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fsurjithctly%2Fastroship&project-name=astroship&repository-name=astroship&demo-title=Astroship%20-%20Astro%20Starter%20Template&demo-description=Astroship%20is%20a%20starter%20template%20for%20startups%2C%20marketing%20websites%20%26%20landing%20pages.%20Built%20with%20Astro%2C%20TailwindCSS%20%26%20Alpine.js.&demo-url=https%3A%2F%2Fastroship.web3templates.com%2F&demo-image=https%3A%2F%2Fuser-images.githubusercontent.com%2F1884712%2F200831799-10ef2456-a02e-4068-b580-4b5326f0b33b.png)
|
|
|
|
|
|
|
|
### Pagespeed Score
|
|
|
|
[](https://pagespeed.web.dev/report?url=https%3A%2F%2Fastroship.web3templates.com%2F)
|
|
|
|
|
|
## Installation
|
|
|
|
If you are reading this on github, you can click on the "Use this template" button above to create a new repository from astroship to your account. Then you can do a `git clone` to clone it to your local system.
|
|
|
|
Alternatively, you can clone the project directly from this repo to your local system.
|
|
|
|
### 1. Clone the repo
|
|
|
|
```bash
|
|
git clone https://github.com/surjithctly/astroship.git myProjectName
|
|
# or
|
|
git clone https://github.com/surjithctly/astroship.git .
|
|
```
|
|
|
|
The `.` will clone it to the current directory so make sure you are inside your project folder first.
|
|
|
|
### 2. Install Dependencies
|
|
|
|
```bash
|
|
npm install
|
|
# or
|
|
yarn install
|
|
# or (recommended)
|
|
pnpm install
|
|
```
|
|
|
|
### 3. Start development Server
|
|
|
|
```bash
|
|
npm run dev
|
|
# or
|
|
yarn dev
|
|
# or (recommended)
|
|
pnpm dev
|
|
```
|
|
|
|
### Preview & Build
|
|
|
|
```bash
|
|
npm run preview
|
|
npm run build
|
|
# or
|
|
yarn preview
|
|
yarn build
|
|
# or (recommended)
|
|
pnpm preview
|
|
pnpm build
|
|
```
|
|
|
|
We recommend using [pnpm](https://pnpm.io/) to save disk space on your computer.
|
|
|
|
### Other Commands
|
|
|
|
```bash
|
|
pnpm astro ...
|
|
pnpm astro add
|
|
pnpm astro --help
|
|
```
|
|
|
|
## Project Structure
|
|
|
|
Inside of your Astro project, you'll see the following folders and files:
|
|
|
|
```
|
|
/
|
|
├── public/
|
|
│ └── ...
|
|
├── src/
|
|
│ ├── components/
|
|
│ │ └── ...
|
|
│ ├── layouts/
|
|
│ │ └── ...
|
|
│ └── pages/
|
|
│ └── ...
|
|
└── package.json
|
|
```
|
|
|
|
Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
|
|
|
|
Any static assets, like images, can be placed in the `public/` directory.
|
|
|
|
## TailwindCSS & Alpine.js
|
|
|
|
TailwindCSS & Alpine.js are already configured in this repo, so you can start using them without any installation.
|
|
|
|
## Credits
|
|
|
|
[Hero Illustration](https://www.figma.com/community/file/1108400791662599811) by [Streamline](https://www.streamlinehq.com/)
|
|
|
|
## 👀 Want to learn more?
|
|
|
|
Feel free to check out [Astro Docs](https://docs.astro.build) or jump into our [Discord Chat](https://web3templates.com/discord).
|
|
|
|
[](https://astro.build)
|