DEV Community

Sh Raj
Sh Raj

Posted on • Updated on

Deploy Button - Vercel, Heroku, Netlify, Repl

Deploy Button


Vercel

Deploy public Git projects with the Deploy Button, providing an easy-to-use flow to set up new projects with Vercel and GitHub, GitLab, or Bitbucket.

Ref. :- https://vercel.com/docs/deploy-button

An example Deploy Button using the following HTML snippet.

Snippets
Use the snippets below in your Git repositories or your dashboards for users to deploy.

Markdown

[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fvercel%2Fnext.js%2Ftree%2Fcanary%2Fexamples%2Fhello-world)
Enter fullscreen mode Exit fullscreen mode

HTML

<a href="https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fvercel%2Fnext.js%2Ftree%2Fcanary%2Fexamples%2Fhello-world"><img src="https://vercel.com/button" alt="Deploy with Vercel"/></a>
Enter fullscreen mode Exit fullscreen mode

URL

https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fvercel%2Fnext.js%2Ftree%2Fcanary%2Fexamples%2Fhello-world
Enter fullscreen mode Exit fullscreen mode

Deploy with Vercel


Heroku

Ref. :- https://devcenter.heroku.com/articles/heroku-button#adding-the-heroku-button

HTML

<a href="https://heroku.com/deploy?template=https://github.com/heroku/node-js-getting-started">
  <img src="https://www.herokucdn.com/deploy/button.svg" alt="Deploy">
</a>
Enter fullscreen mode Exit fullscreen mode

Markdown

[![Deploy](https://www.herokucdn.com/deploy/button.svg)](https://heroku.com/deploy?template=https://github.com/heroku/node-js-getting-started)
Enter fullscreen mode Exit fullscreen mode

URL

https://heroku.com/deploy?template=https://github.com/heroku/node-js-getting-started
Enter fullscreen mode Exit fullscreen mode

Deploy


Netlify

The SVG URL for the button: https://www.netlify.com/img/deploy/button.svg.

The URL the button takes users to: https://app.netlify.com/start/deploy. This link requires the public Git repository as a parameter, for example:

Ref. :- https://docs.netlify.com/site-deploys/create-deploys/

HTML

<a href="https://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-statuskit">
  <img src="https://www.netlify.com/img/deploy/button.svg" alt="Deploy">
</a>
Enter fullscreen mode Exit fullscreen mode

Markdown

[![Deploy](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-statuskit)
Enter fullscreen mode Exit fullscreen mode

URL

https://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-statuskit
Enter fullscreen mode Exit fullscreen mode

Deploy


Repl.it

Here is the URL Format https://replit.com/github/{user}/{repo}

Example :-
This link https://replit.com/github/SH20RAJ/SopCss will deploy this repo https://github.com/SH20RAJ/SopCss on Repl.


Top comments (0)