Skip to content

Latest commit

 

History

History
110 lines (77 loc) · 3.57 KB

devops.md

File metadata and controls

110 lines (77 loc) · 3.57 KB

Deployment

Learn how to expose your website either static/frontend/fullstack to the cloud

Glossary

DevOps: A collection of techniques trying to bridge the gap between development and operations. Pipeline: A series of automated steps that to simplify the testing, building, and deployment of code. CI/CD: Continuous Integration / Continuous Delivery (sometimes Deployments). Subparts of a pipeline dedicated to integrating code, delivering it, and deploying it. Cloud Provider: Companies that offer rentable servers and hosting services that provide flexible computing.

Cloud Providers

GitHub Pages

How to use it ?

  1. Install gh-pages locally npm install gh-pages --save-dev
  2. Add new script to package.json file to deploy your website
  "scripts": {
    // replace dist with your build dir folder
    "deploy": "gh-pages -d [dist]"
  }
  1. Add "homepage” key at the top level in package.json file.
  /*
    * Replace <username> and <RepositoryName> with your username
    * from GitHub and the name of your new repository.
    */
  "homepage": "https://<username>.github.io/<RepositoryName>/",
  1. Deploy your website to Github Pages by running this command npm run deploy

Note

gh-pages behind the scenes will create another branch called gh-pages to push your build files into it

Firebase

  1. You need to create new project first on firebase console

  2. Install firebase-tools package

$ npm install -g firebase-tools

  1. Login to the account firebase login

  2. Init firebase configuration for hosting firebase init

  3. When your website ready just type firebase deploy

Netlify

How to use it ?

  1. Create new account on netlify
  2. Install netlify-cli globally npm install netlify-cli -g
  3. login to your account from netlify-cli using this command netlify login
  4. Inside your project folder genrate new website id for dpploy using this command netlify init
  5. To deploy and make your website live use this command netlify deploy --dir=dist --prod

Notes:

The deploy command needs to know which folder to publish. Netlify CLI will look for this information in three places, in the following order:

  1. in flags specified in the command itself --dir=dist.
  2. in a netlify.toml file stored at the root of your project directory.
  3. in your site settings in the Netlify UI.
# If you want to run your project on your local machine
$ netlify dev
# If you want to share it with your team
$ netlify dev --live

Local Server

Your device as a server :)

In case you want to expose your local server without worrying about deploy it on acutely server.