Agent67
Honorary Master
Ayyyyyy, same here. Nice to see someone else also opt for something other than your usual Bachelor's
-
Join the MyBroadband community
South Africa’s biggest forum. Discuss, discover, and connect with thousands of members.
-
Question of the Day: How do you normally pay for purchases in stores?
Needing practice, give me some websites to clone
- Thread starter chiloanerk
- Start date
- Status
chiloanerk
Member
Wow that's comforting to hear somebody who relates. How far along are you?
Agent67
Honorary Master
Well, I haven't started officially studying yet. I've only started with BSM1501 and ENN1504 while waiting for the rest of my prescribed books to arrive, and for the other myModules sites to go up for the other eight subjects I'm taking (Ten in total). So far, my first year is going ok, was just a hassle at the start to get my myLife and myModules sorted out.
Oh and check out this thread if you want:
How will building a website using html and css by visually looking at another site teach you anything useful?
It will obviously teach you tons about html, css and layouts
Not like the guys is going “view source -> copy -> paste”
MagNorthDigital
Expert Member
No offense taken, and hopefully none given.
A mechanic! Now there is something you can build on! Not necessarily in practice, but in theory.
A car and a website works in the same way. They just use different pieces to power the system.
Chassis + Panels = HTML
Gearbox = State (of the page / data)
Engine = Javascript
Primer & Paint = CSS
Fuel = Data
Oil = Media Queries and Events
Electrical = Document Object Model
Equate what you are learning to what you know and it will be so much easier.
Why I was so abrupt in saying don't spend time cloning pages, is cause you are only taking apart a car door and then fitting it back together. I can absolutely see that you have the will and determination to follow your new found skill through to great heights.
Please attempt to build something that is useful to you, meaningful to your immediate or future needs, as this will definitely elevate your learning to a level far beyond what Unisa can hope to teach you.
As with any machine, you need to take it apart, understand why it works, how it ticks and then assemble it the way you see fit.
Have a peaceful evening.
B-1
Honorary Master
- Joined
- Apr 17, 2020
- Messages
- 11,550
- Reaction score
- 14,844
I dont know why you think its wrong. Copying something done by a professional on a successful application is a great way to learn by imitation. Sure its not a complete experience but it let's him practice some techniques he's learned so far.
MagNorthDigital
Expert Member
Maybe it's the way I was taught, or my experience as a frontend dev, or the way uni prepped me to learn.
In my experience learning by figuring out, innovating and planning is far more valuable in the long term, and leads to lateral and creative ways to solve abstract problems.
If you read what I posted to him, I advocate strongly for purposeful effort, not replication.
We all know html is xml for the dom structure, we all know css is a dsl for visual control of that same dom structure.
Just parroting a layout, from an existing site, never allows him to walk the path of discovery in the sense of figuring it out. What he sees is real, possible and predefined. So he can only ever reach as far as his reference, as far as someone else went.
And then there is the question of "done", replicating a layout, like building a site from mockups, gets you to a state of done, but we all know once the html has been written, the css slapped in, there is a whole bunch of things that still need to happen, reactivity and validity, posting of forms, accessibility, data loading and traversal, to name a few.
Am I suggesting he dive headlong into all of it at once, 2 years into his diploma? Hell no. But guiding him into a place where he could be a functional part of a team, not just a photocopier is where my gut says I should guide him towards.
Ask yourself, how long would someone who can only replicate be useful, when they are sitting next to you in a dev environment. What level of quality, testing or foresight could you hope to see in a PR?
We all have variant opinions, none the "right" answer, almost none completely wrong, and if nothing else, he is getting a preview of exactly that. Devs with opinions different to his own.
B-1
Honorary Master
- Joined
- Apr 17, 2020
- Messages
- 11,550
- Reaction score
- 14,844
I think we have a different view of what he wants to do. Going into the code/markup and simply parroting what was done I would agree is pointless. Not looking at the original code/markup until he's replicated the original as closely as possible using his own code/markup he designed/planned and applied is where I think there is value. In other words try and accomplish the same application without looking at the awnser until he's tried everything to replicate it as closely as possible.
konfab
Honorary Master
That does not make any sense whatsoever.
In a car, the chassis and panels are fixed. They are not dynamic. In a modern web page, it is entirely possible to swap out bits of HTML based on application state. Which means that your analogous car will be able to modify its chassis by changing gear.
Also many, many webpages produce data, rather than consume it. Like a form engine. Don't know of many cars that produce their own fuel.
My advice is to learn what these things are, and understand what they actually do to your webpage.
chiloanerk
Member
Thanks for the Reponses guys I really appreciate it. I took quite a while contemplating which platform I should stick my foot in and I happened to come across this site. I have gained a lot in terms of how many ways I can manipulate elements using CSS and trying to push it as far as I can with my limited skillset. I guess having eyes on my work is better than me just reading off a text book alone, it can get overwhelming.
I would encourage novices like me to at least try these type of exercises, for me I know I am not a creative or artsy person so I cant come up with a complex design but replicating something and getting it in my own way gives me comfort that somebody can come to me with a design and I'll be able to do a decent work getting it up visually.
For my next exercises I want to do more JavaScript and would like suggestions.
Below its a screenshot of my latest attempt I just did after knocking off from work, only the slideshow is functional and to reiterate i wasn't going for responsiveness I just wanted to test my knowledge on manipulating elements to closely bring it to how the pros are doing it. No code or was reused here from the site I was replicating
link
I would encourage novices like me to at least try these type of exercises, for me I know I am not a creative or artsy person so I cant come up with a complex design but replicating something and getting it in my own way gives me comfort that somebody can come to me with a design and I'll be able to do a decent work getting it up visually.
For my next exercises I want to do more JavaScript and would like suggestions.
Below its a screenshot of my latest attempt I just did after knocking off from work, only the slideshow is functional and to reiterate i wasn't going for responsiveness I just wanted to test my knowledge on manipulating elements to closely bring it to how the pros are doing it. No code or was reused here from the site I was replicating
link
Last edited:
Agent67
Honorary Master
It looks pretty nice my guy! Another thing that would be cool is if you take this and build a whole interactive, responsive website around it (Yes, using Javascript. Maybe use other languages as well for backend if you like...). Making the buttons interactive, taking you to other pages, having a login portal for clients/users to log in and do some "internet banking"... The world is your oyster my guy, would be a cool thing to have on a portfolio.
P.S I might be nitpicking but you could make the slideshow a tad smoother, maybe mess around with animation speed and have the images slowly fade in and out? Check out Bootstrap's Carousel if you don't want to opt for manually changing it.
chiloanerk
Member
Hey thanks for the feedback, I will give it a go, I think i know how to do normal databases. Will create a user login system next and for the first time try linking it with a web page. Will try different methods and give feedback
IndigoIdentity
Expert Member
- Joined
- May 10, 2010
- Messages
- 1,964
- Reaction score
- 1,304
I must say, I appreciate that you've taken the time and have made an effort to work with actual code and that you have managed to create some things with just the basics that you have learned so far. In my opinion that is really a good way to start, practice is everything.
I have to agree with some of the others regarding cloning business websites as a starting point. I get the value in this and to learn the basics I think it's great, but as they had also pointed out when it comes to intellectual property this can come across as being a bit professional and could even damage your reputation as a result. Using copyright material without implied / implicit consent is never okay, those works belong to various people or business entities and generally there are strings attached to your reuse of them so you need to ensure that you meet their guidelines if you intend to reuse / publish their content within your work. In many cases though and even for commercial works such as business logos the reproduction for personal use is okay but you still need to ensure that your use case of this would be okay with them (where you're publishing their materials publicly on Github as part of your effort to gain experience within the realm of software development).
I also agree that you would likely come out with a greater level of experience and perhaps more worth out of the time invested if you did come up with a random idea and try to build this out into an actual website. It doesn't need to look great or be perfect to give you good experience, trying to solve the problems that you come across within that would definitely help a lot.
You should take a look at media queries and breakpoints in CSS. It will essentially give you the freedom to display content in different ways depending on the screen width / resolution of the browser client / device. That is really a super power that you need in this day and age!
Anyways, when I was first learning to code website frameworks such as Bootstrap did not yet exist, there was only some basic options available but for the most part the web was built out of collections of good practice and neat tricks that many people were making a use of. Many of these were bundled into the initial release of Bootstrap and I found some of the code that I had used quite often within, that got me kind of hooked on the idea of using it as a starting point. As someone that doesn't have great design skills, they have helped quite a lot over the years.
Thinking too, one of the most basic ones that was available and does still exist is Skeleton and you should definitely take a look through this project as it may give you some ideas to work with. It is really bare bones so it is not too overwhelming to understand and contains a lot of information if you're looking to learn some practical use cases for CSS in general.
With that all said, I think you would be better off in avoiding these types of things initially and rather focus on the underlaying technologies which they wrap around, so raw/plain/vanilla HTML, CSS, Javascript.
I guess one thing that did really help too was reading a lot of books, it helped me to gain a good understanding of how websites work from end to end. Sitepoint publishes some great titles for beginners.
To be honest, I would say that you are on a good path already and have no doubt that you will eventually find a way to make this into a career. Best of luck with that!
I have to agree with some of the others regarding cloning business websites as a starting point. I get the value in this and to learn the basics I think it's great, but as they had also pointed out when it comes to intellectual property this can come across as being a bit professional and could even damage your reputation as a result. Using copyright material without implied / implicit consent is never okay, those works belong to various people or business entities and generally there are strings attached to your reuse of them so you need to ensure that you meet their guidelines if you intend to reuse / publish their content within your work. In many cases though and even for commercial works such as business logos the reproduction for personal use is okay but you still need to ensure that your use case of this would be okay with them (where you're publishing their materials publicly on Github as part of your effort to gain experience within the realm of software development).
I also agree that you would likely come out with a greater level of experience and perhaps more worth out of the time invested if you did come up with a random idea and try to build this out into an actual website. It doesn't need to look great or be perfect to give you good experience, trying to solve the problems that you come across within that would definitely help a lot.
You should take a look at media queries and breakpoints in CSS. It will essentially give you the freedom to display content in different ways depending on the screen width / resolution of the browser client / device. That is really a super power that you need in this day and age!
Anyways, when I was first learning to code website frameworks such as Bootstrap did not yet exist, there was only some basic options available but for the most part the web was built out of collections of good practice and neat tricks that many people were making a use of. Many of these were bundled into the initial release of Bootstrap and I found some of the code that I had used quite often within, that got me kind of hooked on the idea of using it as a starting point. As someone that doesn't have great design skills, they have helped quite a lot over the years.
Thinking too, one of the most basic ones that was available and does still exist is Skeleton and you should definitely take a look through this project as it may give you some ideas to work with. It is really bare bones so it is not too overwhelming to understand and contains a lot of information if you're looking to learn some practical use cases for CSS in general.
With that all said, I think you would be better off in avoiding these types of things initially and rather focus on the underlaying technologies which they wrap around, so raw/plain/vanilla HTML, CSS, Javascript.
I guess one thing that did really help too was reading a lot of books, it helped me to gain a good understanding of how websites work from end to end. Sitepoint publishes some great titles for beginners.
To be honest, I would say that you are on a good path already and have no doubt that you will eventually find a way to make this into a career. Best of luck with that!
JerryMungo
Honorary Master
- Joined
- Jul 18, 2008
- Messages
- 37,576
- Reaction score
- 6,338
Please don't.
a) they're often poor examples
b) the copyright logo is not an ornament.
worst case scenario, if you do want to copy them, don't announce it on here. That's a sure way to get into hot water and associate your name with dodgy business. You will be looking for a job soon and this thread will come up when prospective employers google you.
Read the Terms & Conditions, specifically section 1.12. Website Intellectual Property which you have violated.
TelkomUseless
Honorary Master
- Joined
- Mar 13, 2006
- Messages
- 16,570
- Reaction score
- 11,208
Clone Facebook and sell it 
- Status