origranot / reduced.to Goto Github PK

Free Modern URL Reducer. Make sure to share love by giving it a star.🌟 Have a great day!

License: MIT License

JavaScript 1.06% CSS 1.10% TypeScript 97.44% Dockerfile 0.40%

html css nodejs contributions-welcome nestjs url-shortener tailwindcss typescript docker qwik hacktoberfest nx

reduced.to's Introduction

Reduced.to is a modern web application that reduces the length of link URL. So it's easier to remember, share and track.

App · Report Bug · Request Feature

📚 Table of Contents

🌐 About The Project
- 🔥 Built With
🚀 Getting Started
🐱‍💻 Usage
🧱 Roadmap
🥇 Contributing
🏆 Contributors
📝 License
💌 Contact

🌐 About The Project

🔥 Built With

List of frameworks/libraries used to bootstrap the project.

(back to top)

🚀 Getting Started

📃 Prerequisites

List of things you need to run the project locally and how to install them.

npm
```
npm install npm@latest -g
```
docker
```
https://docs.docker.com/get-docker/
```

💻 Installation

Fork / Clone this repository
Install NPM packages
```
npm install
```
Copy .example.env to .env and fill it properly (see Configuration)

Make sure you have a local instance of PostgreSQL running on port 5432. If not, you can run it using docker:

docker run --name reduced_to_db -e POSTGRES_USER=postgres -e POSTGRES_PASSWORD=postgres -e POSTGRES_DB=reduced_to_db -p 5432:5432 -d postgres

Run Prisma migration from root folder:
```
npx nx migrate-dev prisma --name=init
```
Run the backend from root folder:
```
npx nx serve backend
```
Run the frontend from root folder:
```
npx nx serve frontend
```

👩‍💻 Development

The project is structured in the following way:

.
├── apps/
│   ├── backend
│   └── frontend
└── libs/
    ├── config
    └── prisma

🐳 Docker

You can build the docker images by running the following nx command:

npx nx run-many -t docker-build

This command will automatically build the dependencies and the backend and frontend images.

🐙 Docker compose

In case you have docker installed, you can single-click deploy and test your changes by running the following and going to http://localhost:5000/ on your browser.
When you run the command below, don't forget to change the .env file with the correct values.
```
docker compose -f docker/local/docker-compose.yml -p reduced-to up
```

☸ Deployment

You can deploy the app to a Kubernetes cluster by installing the Helm chart.

Navigate to the chart directory (/docker/k8s/chart)
Update the values in the values.yaml file
Run the following command to deploy the app to your cluster:

helm install reduced-to . --namespace reduced-to --create-namespace

👷 Configuration

For the minimal configuration you can just rename the .example.env files to .env.

General

BACKEND_APP_PORT: Backend port
FRONTEND_APP_PORT: Frontend port
NODE_ENV: Node environment (development / production)

Database

DATABASE_URL: Database connection string

Rate Limit

RATE_LIMIT_TTL: Rate limit TTL (time to live)
RATE_LIMIT_COUNT: Number of requests within the ttl

Paddle - (Payment Gateway - https://www.paddle.com/ - Optional)

PADDLE_ENABLE: Wethter to enable Paddle or not
PADDLE_WEBHOOK_KEY: Get it from your Paddle account
PADDLE_SECRET_KEY: Get it from your Paddle account

Logger

LOGGER_CONSOLE_THRESHOLD: Threshold level of the console transporter.

Frontend

DOMAIN: Domain of your frontend app
PUBLIC_PADDLE_KEY: Get it from your Paddle account (Not needed when running locally)
API_DOMAIN: Domain of your backend instance (used for server side requests)
CLIENTSIDE_API_DOMAIN: Domain of your backend instance (used for client side requests)
STORAGE_DOMAIN=Domain of your bucket (used for storing images)

Redis

REDIS_ENABLE: Whether to use external Redis store or not
REDIS_HOST: Redis instance host
REDIS_PORT: Redis instance port
REDIS_PASSWORD: Redis instance password
REDIS_TTL: Redis ttl (in seconds)

Auth

JWT_ACCESS_SECRET: Jwt secret (used for access tokens)
JWT_REFRESH_SECRET: Jwt secret (used for refresh tokens)

Safe Browsing API

SAFE_URL_ENABLE: Whether to use Google Safe Browsing API or not
SAFE_URL_GOOGLE_SAFE_BROWSING_API_KEY: Get it from https://developers.google.com/safe-browsing/v4/get-started

Novu

NOVU_API_KEY: Get it from https://novu.co/, you don't need this when running locally (just verify your email from the database)

Happy Hacking !

Change my plan on development

If you want to change your plan on developemnt (Assuming you have a local instance of PostgreSQL running on port 5432 and you don't have Paddle configured):

Register locally on the app.
Go to your database and create a new row in the Subscription table:
- id: 1
- userId: (you can find your user id in the User table)
- plan: (FREE / PRO / BUSINESS)
- status: active
- endDate: Choose a date in the future
- scheduledToBeCancelled: false
- endDate: empty (NULL)
- nextBilledAt: empty (NULL)
- createdAt: current date
- updatedAt: current date
Relogin to the app (refresh the JWT token)
You can now access the premium features.

(back to top)

🐱‍💻 Usage

Simply copy and paste a URL into the provided area. Then click shorten URL! Your URL has now been shortened!

(back to top)

🧱 Roadmap

Just create a Pull request already 😃

See the open issues for a full list of proposed features (and known issues).

(back to top)

🥇 Contributing

Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star ⭐!

Fork the Project
Create your Feature Branch (git checkout -b feature/AmazingFeature)
Commit your Changes (git commit -m 'Add some AmazingFeature')
Push to the Branch (git push origin feature/AmazingFeature)
Open a Pull Request

🏆 Contributors

(back to top)

📝 License

This project is licensed under the terms of the MIT License

(back to top)

💌 Contact

Project Link: https://github.com/origranot/reduced.to

(back to top)

reduced.to's People

Contributors

Stargazers

Watchers

Forkers

sagnik26 jaskaran2 eduardconstantin canarygrapher niteshjitender alphanewrex gurudanito001 ddouble-d motasimmakki urvisinghal cloudfex vidishaag mldamico thomassed nifaliana namandhanotia sagnik264 anchal-gupta guillempm gunjansaha55 theshonuff olumarshal timoransky vaishantmakan jayshreetundele bbhuva ayush-kori sameepaher rachitag112 biancam5 biswajitsahoo-tech sravanpant n03nilay mohd-adil-jmi saavrm26 akhilj321 sarthakk24 ojashkush ashwin3005 gunesnt siddakbagga13 manassahoo-dev theonlywayup jaspreet099 abhishekmorla muthulakshimi naandalist im-techno aigdonia ebrg786 gauravdarkslayer smiti-maheshwari bhumika-1-3 sb-decoder aditi10701 drk1rd detronetdip jgoerner jmdagenais professorjrod m-rahul1 kiritocode1 mayuri-agrawal rinshin-jalal kraj2503 rahulchaudhary2244 owengaspard incrediblezuess rahul10saha mcholy ahsanwtc lalitkushwah amitkumar-y engrmahabub shreyaansjain06 sarahesbie alon2904 ibrahimtelman irapandey dhiemaz frogo123 dmunkei cweave guischweizer lauk20 vikki123 kadar77 himanshu-ra ashu25072003 amittri1025 cagoncil pamornt miguelocegueram mau211 codedmachine111 umairkhan78647 aditya-ahirwar princeofnubia heza-ru anirudha-ca

reduced.to's Issues

Meezan Bank mobile account app

Help

Customize the scrollbar

On click of the link on readme the url should open on next tab.

Add code of conduct

Hey @origranot, assign this issue to me i will add code of conduct, and also add Hacktoberfest tag

Jazz Maps

Documentation is not updated

Issue:
After merging PR #64 , the directions in "HOW TO INSTALL " section in README.md is not working.

it is node app.js but it won't work, after making nextjs configurations. So I have to change this

npm start

DOCS: Need to update readme

Hey guys,

We migrated to NestJS on our previous pr.
We need to change the installation paragraph at the readme.

Migrate to frontend framework

As @origranot said, we should migrate to a frontend framework.
I could work on migrating to 🔰Vue.js

I personally prefer Vue.js over React.js as it is so powerful framework and has a softer learning curve and its gaining more popularity over the time, if you prefer to migrate to React close this issue and let's wait for someone interested.

Star History

Implementing a better ui

Hey, I would like to implement a better UI. Can you please assign me this

Minimal and updated readme.

https://github.com/layer5io/layer5/blob/master/README.md

I can design a readme file for this project to get better reach and clear understanding.
Here is a sample for reference purpose.

adding a pop up toast for "your link has been copied"

I will create the Better readme

Improving the readme file

Enhancing the README.md file furthuremore by adding the contributors list.

Shortend URL Public Statistics Page

In Order to make a value for this App not to be another URL shortener, I believe we need to add some numbers.

As A short URL creator I need to track some statistics for the link I just created, I suggest the following number:

Number of Times this link was opened.
Geolocation, or list of Referrals where as this link was opened from.

Acceptance Criteria

Create a link details page at URL <domain>/<shortened_link>/stats.
this page should display the number of times this link was opened.
this page should display a brief of maximum 5 referral links that led to this link.
this page should be publicly accessible.

Custom shortened links

As A Shortened URL creator I need to create custom shortened links.

This is useful for premium users and advanced users.

Acceptance Criteria

User should be able to click create custom link button
user should enter custom link.
custom link should be validated not to be duplicate, and fulfills length and character validation

Better Space utilization

Currently, the items are placed at the top. So there is lot of negative space from top.
We can make it center aligned to properly utilize the space.

Animations

I can add animations to the frontend and i can also improve the ui using tailwind

Migrating app to a backend framework.

It would be great if we can move it to an MVC framework for backend.
AdonisJs ( https://github.com/adonisjs/core ) is a great one.
Let me know your thoughts @origranot

Adding A Favicon

I can add a favicon icon to the website. Please assign me this.

Adding a Favicon to the project

It might look great to have a favicon of the website!

Light mode and dark mode switch

We can add a button on the top bar for switching themes

Automatically copy the link after the short url is created

I would like to work on this issue!

Create a better readme.md

Add copied animation

I would like to add a popup animation when the link is copied , also please assign me this issue if you want me to work on it

tests: Add tests to shortener controller

Hey guys, we need to add some tests to our project.
This should cover the tests on the shortener.controller.ts

tests: Add tests to our shortener service

Hey guys, we need to add some tests to our project.
This should cover the tests on the shortener.service.ts

Multistage build in Dockerfile

https://github.com/origranot/url-shortener/blob/dd5979e840b851371aa8d886f7b34c6c38f35455/Dockerfile#L21

Hey @origranot wouldn't it be great if we use multistage build and build our application? Currently to build the docker image we are just copying the files and running the app in development without building it. I can implement that, please let me know your view to this and if you agree please assign me.

Websites without http or https are invalid

Currently it gives an "Invalid URL" error when a url is entered (without http or https)

So to fix this, in this PR i just added "https://" to the url if it doesn't start with the same.
This will also be checked later on, as usual
image

Not generating short link

The app is not generating shorl url link and keeps displaying This url is invalid...

The entered url: https://github.com/JunDevHarsh/amazon-clone.

Add a footer

add a footer to the section which makes the app a better visual impact.
kindly assign me the same. I am interested in working on this.

Clear input field after shortening url

HI, I'm thinking that maybe clearing input field after shortening url world create a better user experience for those who have more than one url to shorten?
Currently, users have to delete their input if they want to shorten another link (like the screenshot below).

Does this sound like a good idea to you? if so, I'm willing to make this small change.

Bug: Link copied message for invalid url as well

On clicking the display message of invalid link it says "Link has been copied to the clipboard" which doesn't make any sense

Here is the video displaying the issue -

screen-capture.1.webm

I can fix this issue and create a PR

Use Redis database to store data

Currently data is being stored in memory which can get deleted if the server restarts. Storing data externally to a database will keep data safe. Redis is a good solution, given the data we have is a key value pair.

Shortened URL directing to https://https:// link

When you paste the link and it's shortened, the page it redirects to has https:// in it twice

Steps to reproduce:

Type in a link and press "Shorten URL"
Copy URL and paste in browser

Screenshots

Confetti animation on copying url

This might seem a bit extra but I wanna try adding confetti animation when the URL is copied

we should rename it url-longener

Check for Invalid Url

Currently, the app is shortening the URL provided by the user irrespective of being valid or invalid.
The URL should be verified before shortening it.
If URL does not exist "Invalid URL" message should be shown.

make button prettier and cool

I made button prettier and cool with a better hover effect

Hey! i want to contribute to your repo by adding some cheatsheet

Develop button to switch between dark and light mode

Hello all!

I saw on the README.md, the suggestion to include the dark mode switch button.

I would like to work on this. I thought about leaving the light mode this way, what do you think?

If it's ok, you can assign this issue to me. I will include this.

Add live link

Add a live link of the project to the readme or about page

Missing docker file

Hello! I saw that there's a docker file that's missing. Its better to have a docker of your application so that its easy to setup on any environment with just docker installed.
I can work on that, as a part of hacktoberfest and contribute towards url-shortner :-)

UI need some improvement

I have made these changes.

Please check this PR

adding CODE_OF_CONDUCT.md file

I would like to add CODE_OF_CONDUCT.md to this repo..

HerokuApp is broken

As I see heroku app is broken after converting the project to Typescript.

We need to specify some extra arguments to help him load the project.

I will create a PR adding this settings, can you assign me this task?

Acceptance Criteria

After creating a shortened URL, display button suggests if need to get QR format copy
button should be clickable and after click on it, it should generate a QR version of shortened url and displays it
QR image should be copied to clipboard and notify user about successful copy in clipboard.
QR image should not be stored on server in order not to consume space.

origranot / reduced.to Goto Github PK

reduced.to's Introduction

🌐 About The Project

🔥 Built With

🚀 Getting Started

📃 Prerequisites

💻 Installation

👩‍💻 Development

🐳 Docker

🐙 Docker compose

☸ Deployment

👷 Configuration

General

Database

Rate Limit

Paddle - (Payment Gateway - https://www.paddle.com/ - Optional)

Logger

Frontend

Redis

Auth

Safe Browsing API

Novu

Change my plan on development

🐱‍💻 Usage

🧱 Roadmap

🥇 Contributing

🏆 Contributors

📝 License

💌 Contact

reduced.to's People

Contributors

Stargazers

Watchers

Forkers

reduced.to's Issues

Star History

Acceptance Criteria

Acceptance Criteria

Acceptance Criteria

Recommend Projects

Recommend Topics

Recommend Org