Welcome, Guest: Join Nairaland / LOGIN! / Trending / Recent / New
Stats: 2,523,949 members, 5,774,545 topics. Date: Thursday, 06 August 2020 at 11:17 PM

Rate My One Page Site - Programming - Nairaland

Nairaland Forum / Science/Technology / Programming / Rate My One Page Site (418 Views)

Clark WP Free One-page Resume Wordpress Theme / Prestashop One Page Checkout Module / One Page Vs Multi-page Websites - Good Or Bad For SEO ? (2) (3) (4)

(1) (Reply) (Go Down)

Rate My One Page Site by iLearner: 11:02am On Aug 01
Did this small one page site for a friend that does music. It's just like an introductory site. Nothing big.

I used about 250 lines of HTML, 900 lines of CSS and 300 lines of JavaScript.

Rate my colour pick, responsiveness and anything else.


https://bandittude.netlify.app/

wink

1 Like

Re: Rate My One Page Site by stanliwise(m): 1:21pm On Aug 01
iLearner:
Did this small one page site for a friend that does music. It's just like an introductory site. Nothing big.

I used a about 250 lines of HTML, 900 lines of CSS and 300 lines of JavaScript.

Rate my colour pick, responsiveness and anything else.


https://bandittude.netlify.app/

wink
Don't know how skilled you are but you did a really great job though.
But you could improve your work with some frontend framework and gain more inspiration from other website with more sleek UI than yours. They are littered all over the net
Re: Rate My One Page Site by iLearner: 1:42pm On Aug 01
stanliwise:
Don't know how skilled you are but you did a really great job though.
But you could improve your work with some frontend framework and gain more inspiration from other website with more sleek UI than yours. They are littered all over the net

Thanks thanks smiley

I'm not really skilled like that.
I'm only just trying to master HTML, CSS and vanilla JavaScript for now.

In the next few weeks, I'll be looking forward to diving into ReactJS.
Re: Rate My One Page Site by bunnaes: 2:02pm On Aug 01
LA click la bend
Re: Rate My One Page Site by squash47(m): 7:07pm On Aug 01
bunnaes:
LA click la bend

Who u epp ?
Re: Rate My One Page Site by arejibadz(m): 7:36pm On Aug 01
Nice work....how did you go about the animation
Re: Rate My One Page Site by iLearner: 10:23pm On Aug 01
arejibadz:
Nice work....how did you go about the animation

Thanks.

I used the CSS transition and transform, and powered it with JavaScript IntersectionObserver which allows the animation gets triggered only when a user scrolls to that section of the screen.
Re: Rate My One Page Site by arejibadz(m): 10:40pm On Aug 01
iLearner:


Thanks.

I used the CSS transition and transform, and powered it with JavaScript IntersectionObserver which allows the animation gets triggered only when a user scrolls to that section of the screen.
can u please post d code
Re: Rate My One Page Site by cixak95211: 1:06am On Aug 02
Trashy, you can do better
evrything is just off . . color choice, color depth, UI . .
form doesnt validate inputs, too much white space, too large images, not compressed
no padding, margins, etc

p.s. take this as constructive criticism to make you better and not a jab

1 Like

Re: Rate My One Page Site by iLearner: 5:17am On Aug 02
arejibadz:
can u please post d code

I'll post it when I charge my PC
Re: Rate My One Page Site by iLearner: 5:27am On Aug 02
cixak95211:
Trashy, you can do better
evrything is just off . . color choice, color depth, UI . .
form doesnt validate inputs, too much white space, too large images, not compressed
no padding, margins, etc

p.s. take this as constructive criticism to make you better and not a jab

I didn't intend to make the form validate for now. Like I said, it's just an introductory page with simple HTML, CSS and JavaScript, and won't be serving any official purpose yet.

Highlight the parts that have no margin and padding so I can correct.

About the images, the friend I did it for said she wants a full screen slideshow, so I just left the pictures the way they are.

Thanks.
Re: Rate My One Page Site by iLearner: 8:07am On Aug 02
arejibadz:
Nice work....how did you go about the animation


Add class of "fade-in" to everything you want the animation to take effects on.

2 Likes

Re: Rate My One Page Site by ehinmowo: 10:57pm On Aug 02
iLearner:


Thanks thanks smiley

I'm not really skilled like that.
I'm only just trying to master HTML, CSS and vanilla JavaScript for now.

In the next few weeks, I'll be looking forward to diving into ReactJS.

How did you create that loading effect? Did you do the back end too? How did you come about the hosting?
Re: Rate My One Page Site by iLearner: 11:14pm On Aug 02
ehinmowo:


How did you create that loading effect? Did you do the back end too?

Nope, there's no backend at all.

The idea is to have the proloader remain displayed until everything on the page gets loaded.

Re: Rate My One Page Site by ehinmowo: 10:25am On Aug 03
iLearner:


Nope, there's no backend at all.

The idea is to have the proloader remain displayed until everything on the page gets loaded.

How were you able to host it in such a way that I could get to it from here? From Nairaland.
Re: Rate My One Page Site by QuantumR: 11:13am On Aug 03
Nice animations, i like d preloader aspect also. BUT some things need to adjusted, the images are not fully responsive e.g, the hero section images stretches (samsung tab).

Re: Rate My One Page Site by iLearner: 6:10pm On Aug 03
QuantumR:
Nice animations, i like d preloader aspect also. BUT some things need to adjusted, the images are not fully responsive e.g, the hero section images stretches (samsung tab).

Thanks for bringing this to my notice. I'll work on making it responsive on the Samsung Tab.

Btw, what's the width of the tab?
Re: Rate My One Page Site by iLearner: 6:13pm On Aug 03
ehinmowo:


How were you able to host it in such a way that I could get to it from here? From Nairaland.

It's easy.

Go to netlify.com and open an account.
On your dashboard, click on deploy.
Drag and drop the folder containing your work into the deployment area, and that's all. You'll be given a URL which you can edit. You can as well buy a custom domain for your site.
Re: Rate My One Page Site by QuantumR: 7:47pm On Aug 03
iLearner:


Thanks for bringing this to my notice. I'll work on making it responsive on the Samsung Tab.

Btw, what's the width of the tab?

I dnt knw d exact width, buts its a 9.6inch display
Re: Rate My One Page Site by ehinmowo: 8:10pm On Aug 03
iLearner:


It's easy.

Go to netlify.com and open an account.
On your dashboard, click on deploy.
Drag and drop the folder containing your work into the deployment area, and that's all. You'll be given a URL which you can edit. You can as well buy a custom domain for your site.

Thanks
Re: Rate My One Page Site by Akiliogidi: 8:13pm On Aug 03
iLearner:


It's easy.

Go to netlify.com and open an account.
On your dashboard, click on deploy.
Drag and drop the folder containing your work into the deployment area, and that's all. You'll be given a URL which you can edit. You can as well buy a custom domain for your site.
Nice one, which IDE are u using
Re: Rate My One Page Site by eoeefosa: 8:51pm On Aug 03
Nice work
Re: Rate My One Page Site by iLearner: 10:19pm On Aug 03
QuantumR:


I dnt knw d exact width, buts its a 9.6inch display

Thanks. I'll work on it
Re: Rate My One Page Site by iLearner: 10:21pm On Aug 03
Akiliogidi:

Nice one, which IDE are u using

Thanks.

Visual Studio Code
Re: Rate My One Page Site by iLearner: 10:21pm On Aug 03
eoeefosa:
Nice work

Thanks
Re: Rate My One Page Site by Akiliogidi: 12:21am On Aug 04
iLearner:


Thanks.

Visual Studio Code

Ok, downloaded both vs code and visual studio, finding it difficult to code in cshtml/asp.net web app. So for now i am sticking to plain html on vsc, but i still want to code in asp.net core web app

(1) (Reply)

Co-developers I Need Your Help / What Most Schools Don't Teach (video) / I Need A Good Game Developer To Work With.

(Go Up)

Sections: politics (1) business autos (1) jobs (1) career education (1) romance computers phones travel sports fashion health
religion celebs tv-movies music-radio literature webmasters programming techmarket

Links: (1) (2) (3) (4) (5) (6) (7) (8) (9) (10)

Nairaland - Copyright © 2005 - 2020 Oluwaseun Osewa. All rights reserved. See How To Advertise. 81
Disclaimer: Every Nairaland member is solely responsible for anything that he/she posts or uploads on Nairaland.