How to push your website online for free (Bonus: How to get domain name for 2$)

Welcome my friend ! Today I will show you how to deploy your static website for free with Netlify !

In bonus I will show you where you can bug domain name for 2$ and connect it will Netlify !

First step:

Create an account on https://www.netlify.com/…


This content originally appeared on DEV Community and was authored by CodeOzz

Welcome my friend ! Today I will show you how to deploy your static website for free with Netlify !

In bonus I will show you where you can bug domain name for 2$ and connect it will Netlify !

First step:

Create an account on https://www.netlify.com/.

In the overview, you will need to connect your git project to Netlify.

Screenshot 2021-07-06 at 17.54.55.png

Go to https://app.netlify.com/start Select your plateform between Github, Gitlab or Bitbucket.

Second Step:

Choose the branch to deploy, it's means that when you will push onto this branch, Netlify will build the project and re-deploy it.

Screenshot 2021-07-06 at 18.01.01.png (1)

For me I create a dedicated branch named prod.

Third Step:

Screenshot 2021-07-06 at 18.01.01.png (2)

You will need to provide the npm command that will build your project (and the output directory name).

I use npm run build and I named the output file /dist (classic).

Netlify will build your project and deploy it on a special url.

BONUS

If you don't have domain name, read this section !

Go to https://www.namecheap.com/domains/domain-name-search/

Put your domain name wanted, and select a domain name cheap (for example .art). The first year, the domain name will be cheap and you will need to pay more for the next years, it depends of the domain name (.art stay very cheap).

Buy your domain name and when you receive the confirmation by email, you will need to verify your mail (in order to link email and your domain name).

You will just need to select your domain name on the dashboard and click on verify account.

icannwhois_ar2

Fourth Step:

Set up a custom domain !

Screenshot 2021-07-06 at 18.11.10

Note: You can see the special url generated by Netlify ! (By default any of your build project has this special url in case of you have an issue with your domain name)

So put your domain name

Screenshot 2021-07-06 at 18.12.46

Last Step:

Set up Netlify DNS for your domain !

Click on check DNS configuration, you will have four hostnames, keep it, we will need it .

Screenshot 2021-07-06 at 17.54.55.png (2)

Come back into Namecheap, go to dashboard and click on manage into your domain name.

Screenshot 2021-07-06 at 18.19.45

In nameservers select custom DNS and put the four hostnames !

Screenshot 2021-07-06 at 18.23.17

Save it and wait a few minutes in order to link your hostname with your domain name !

HTTPS:

Netlify will add a SSL in order to have HTTPS on your website !


This content originally appeared on DEV Community and was authored by CodeOzz


Print Share Comment Cite Upload Translate Updates
APA

CodeOzz | Sciencx (2021-07-06T16:35:19+00:00) How to push your website online for free (Bonus: How to get domain name for 2$). Retrieved from https://www.scien.cx/2021/07/06/how-to-push-your-website-online-for-free-bonus-how-to-get-domain-name-for-2/

MLA
" » How to push your website online for free (Bonus: How to get domain name for 2$)." CodeOzz | Sciencx - Tuesday July 6, 2021, https://www.scien.cx/2021/07/06/how-to-push-your-website-online-for-free-bonus-how-to-get-domain-name-for-2/
HARVARD
CodeOzz | Sciencx Tuesday July 6, 2021 » How to push your website online for free (Bonus: How to get domain name for 2$)., viewed ,<https://www.scien.cx/2021/07/06/how-to-push-your-website-online-for-free-bonus-how-to-get-domain-name-for-2/>
VANCOUVER
CodeOzz | Sciencx - » How to push your website online for free (Bonus: How to get domain name for 2$). [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/07/06/how-to-push-your-website-online-for-free-bonus-how-to-get-domain-name-for-2/
CHICAGO
" » How to push your website online for free (Bonus: How to get domain name for 2$)." CodeOzz | Sciencx - Accessed . https://www.scien.cx/2021/07/06/how-to-push-your-website-online-for-free-bonus-how-to-get-domain-name-for-2/
IEEE
" » How to push your website online for free (Bonus: How to get domain name for 2$)." CodeOzz | Sciencx [Online]. Available: https://www.scien.cx/2021/07/06/how-to-push-your-website-online-for-free-bonus-how-to-get-domain-name-for-2/. [Accessed: ]
rf:citation
» How to push your website online for free (Bonus: How to get domain name for 2$) | CodeOzz | Sciencx | https://www.scien.cx/2021/07/06/how-to-push-your-website-online-for-free-bonus-how-to-get-domain-name-for-2/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.