improves something that you have created last week with advanced HTML and CSS technique
- I reworked my last week assignment to make it looks more modern with similar concept of warframe website as reference.
- Google font is used in this project, with Oswald.
- Text shadow are applied for text on top of images to make it more clearer.
- News section are made using Asymmetrical Grid
- Day and Night mode is made by hiding checkbox and adding bunch of transition magic to make it FEEL like sliding buttons.
- Carousel is added at the bottom of News section, purely from css. I beg thee not to explain it in-depth because I made it at the dawn of night half-asleep.
- Media query are optimized for 1440px, with small adjustment at 1024px and 768px. !important is used for screen above 600px to fix Mobile's burger menu sometimes hides navbar when transitioned to larger screen size.
-
Go to Site, click Add new site, Import an existing project
-
Click deploy with GitHub, and wait for authorizing
-
Choose the repository
-
Scroll down, Deploy Site
Once you deploy the site, it will be automatically deployed when you push somethings to your GitHub repository.
-
Go to domain seller websites (n this case I'm using Niagahoster) Click domain, cari & cek domain.
-
Type your site name, make sure your site name is available, and click Cek Sekarang.
-
Choose your domain (in this case I'm using .site) choose your payment option and follow the instruction for your payment method.
-
After making a payment then fill in your personal data then your domain is active and can be used.
-
Go to "dash.cloudflare.com", click Sign up, follow the instruction and confirm your email.
-
Login using the account you just made.
-
Click "Add a site" button on the right-side of the web page.
-
Enter your site name, click Add site.
-
Scroll down and click Free, then Continue.
-
Copy Nameserver 1 & 2, later you'll need this to overwrite your domain Nameserver.
-
Go to your domain provider, click Domains -> your Domain Name.
-
click Nameservers, and paste Nameservers provided by Cloudflare.
-
go to your cloudflare account, click your website name -> DNS -> Records, click Add record.
-
Enter "Type: CNAME, Name: @, IPv4 address: your Netlify.app link.
-
Enter "Type: CNAME, Name: www, IPv4 address: your Domain name.
-
Login to your Netlify account, then click your deployed website.
-
go to Site overview -> Domain settings
-
-
Click Add domain alias, type your domain name, verify click Add domain.
-
Wait for awhile and your site is ready to be used.
-
-
-
![](assets/web.png)