Frontend web project for the "Shortilin" service created with Astro using a hybrid output, it allows the creation of shortened URLs and their redirection.
you need to raise the backend api to fully use the page.
the backend api repository:
check demo in Shtilin
- generate shortened URLs on its main page
- by adding the ID, it performs redirection using an intermediate screen and a waiting time to display the complete URL
- the page has a general dark mode that is saved in the local storage to always remember your choice
- it includes a custom 404 error page
Clarification, all commands to execute the project have the "--host" flag to lift the project on your private network.
Allows building and running the project.
npm startAllows running the project in development mode.
npm run devAllows only building the project.
npm run buildAllows only running the project if it's already built.
npm run previewThis project already includes a Dockerfile to create an image of itself using these commands:
- Exposed port: 10000
- Move to root of client.
cd client-web-shortilin- Create the project's image.
docker build -t client-web-shortilin .- Run a container based on that image.
docker run -p 9000:10000 client-web-shortilinInside of your Astro project, you'll see the following folders and files:
/
│
├── .vscode/
│ ├── extensions.json
│ ├── launch.json
│ └── settings.json
├── public/
│ ├── favicon.svg
│ ├── image-meta-404.png
│ ├── light-off.png
│ ├── light-on.png
│ └── query-selector.js
├── src/
│ ├── components/
│ │ └── header.astro
│ ├── css/
│ │ └── index/
│ │ ├── button-get-url.css
│ │ ├── div-loader.css
│ │ ├── input-url.css
│ │ └── link-to-url.css
│ ├── layouts/
│ │ └── head.astro
│ ├── pages/
│ │ ├── 404.astro
│ │ ├── [toRedirect].astro
│ │ └── index.astro
│ ├── env.d.ts
│ └── utils.js
├── ...
└── tsconfig.json
Distributed under the MIT License. See LICENSE for more information.