Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Daniel Maia
2,559 PointsWhat do I need to know?
I have a task to do a website for a ecologic community in my school, and my start point is making a simple website containing plant information, and then I'll do a blog.
The plant "database" website is way more simple, because it doesn't need to much input from the user, it's a static environment, though I want it to be something very well designed, something beautiful, not only a boring website with things you don't need to know. So here's the thing:
The user will have access to the website by reading a QR code, so it's supposed to be mobile.
I want it to have only one HTML page for dynamic changing information. This is something like, it'll be only one HTML page, but the information will change completely depending on what plant the user selected.
I want it to have a div that will be partially hidden, only showing an arrow for the user, and as soon as the user clicks the arrow, it'll expand, showing the user some links to move on throughout the website. If he clicks the arrow again, it'll collapse.
If there's no information about what plant the user chose, however, if he enters directly by the site URL, a div will appear in front of everything, and everything aside will blur, giving focus to the windows. This windows will have some plants for the user to choose, so as soon as he chooses one, the div will go away, the page will adapt it's information to the corresponding plant, it'll not be blurred anymore, and then the user will be able to continue navigating.
It may have other features in the future, but these are the ones in my first plan. Obviously, I know I'll need to know HTML and CSS, but what else will I need to know to accomplish this? Thanks for any constructive feedback :-)
5 Answers
Stephen Stewart
5,155 PointsHave a look at the PHP Development track. Should teach you the basics of what you need. It also includes some javascript and jquery, which will help you accomplish the last couple of bullet points.
Philip G
14,601 PointsHi Daniel,
As you mentioned, you'll need HTML and CSS Skills.
I want it to have only one HTML page for dynamic changing information. This is something like, it'll be only one HTML page, but the information will change completely depending on what plant the user selected.
I want it to have a div that will be partially hidden, only showing an arrow for the user, and as soon as the user clicks the arrow, it'll expand, showing the user some links to move on throughout the website. If he clicks the arrow again, it'll collapse.
For the dynamic things, you'll need JavaScript.
The plant "database" website is way more simple, because it doesn't need to much input from the user, it's a static environment, though I want it to be something very well designed, something beautiful, not only a boring website with things you don't need to know. So here's the thing:
For your plant database, I recommend you to use a MySQL Database. As the server-side language you should use PHP, because it's simple and powerful. Ruby is very hard to learn and not required for your project The only thing you have to keep in mind is PHP & MySQL support of your Web host.
Much luck with your little project. I would be glad if you send me a link when your finished. Then I'll also give you feedback.
Kindly Regards,
Philip
Daniel Maia
2,559 PointsThanks, but won't I need to know some JQuery as well? I mean, I can't quite tell, I never studied JQuery, but I hear people say it's very used for animations, and the website will have some basic animations (fade in, fade out, some swipes, etc.). And the plant database is the own HTML page, but there will be something containing all the text from different plants, so when the user selects, for example, lemon grass, the HTML page will load all the text and images associated to lemon grass. If he changes the plant, it'll do the same thing for the other plant. This including other features, obviously.
Will this really need only HTML, CSS, and Javascript?
Philip G
14,601 PointsIt's helpful to know jQuery, but you can usw the JS Library you're most familiar with. But jQuery is quite useful.
Daniel Maia
2,559 PointsOk mate, thank you a lot :)
Philip G
14,601 PointsGlad to help :). As I already said, I would be happy if you send me a link of the finished Project to treehouse@philipgraf.at.
Bruno Calheira
12,625 PointsHi Daniel ,
It´s nice to meet other Brazilians here at Tree House !
Recently I created a site that contains some of the features you intend to provide .
Take a look : www.calheira.com/ofensometro
I developed it using only html, css, javascript and jquery.
The source code is available on github : https://github.com/calheira/ofensometro
See you!
Philip G
14,601 PointsWhy don't you found a Brazilian Treehouse Community? :)
Bruno Calheira
12,625 PointsGreat idea Philip! ˆ_ˆ
Philip G
14,601 Points@brunocalheira Your website is really well made! The only thing you can improve is the select style, but this is not essential. Good job!
P.S.: Have you already checked out https://www.polymer-project.org/components/paper-elements/demo.html#paper-dropdown-menu and http://www.google.com/design/spec/material-design/introduction.html ?
Best Regards, Philip
Bruno Calheira
12,625 PointsThank you Phillip! I'll see it.
Daniel Maia
2,559 PointsDaniel Maia
2,559 PointsNo ruby? I was expecting someone to answer me Ruby. Though, thanks mate :)