Shortilin

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:

• https://github.com/RomanFama592/shortilin-backend-api

check demo in Shtilin

📑 Contents

1. ✍ Features
2. 👩‍💻 Commands
3. 🐳 Ready for Docker
4. 👋 Contributors
5. 🚀 Project Structure
6. 👨‍⚖️ License

✍ Features

• 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

👩‍💻 Commands

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 start

Allows running the project in development mode.

npm run dev

Allows only building the project.

npm run build

Allows only running the project if it's already built.

npm run preview

Back to top 🔼

🐳 Ready for Docker

This project already includes a Dockerfile to create an image of itself using these commands:

• Exposed port: 10000

1. Move to root of client.

cd client-web-shortilin

2. Create the project's image.

docker build -t client-web-shortilin .

3. Run a container based on that image.

docker run -p 9000:10000 client-web-shortilin

Back to top 🔼

👋 Contributors

Back to top 🔼

🚀 Project Structure

Inside 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

Back to top 🔼

👨‍⚖️ License

Distributed under the MIT License. See LICENSE for more information.

Back to top 🔼