Projects content and plagiarism

It’s my first time posting here and I was wondering whether I have made a mistake or not.

So far I have finished three html/css projects: build a tribute page, build a survey form, and build a landing page. When I read the instructions, I understood that we had to design pages that looked like those. It is stated that we can give them our personal style, but I thought we had to use the same content. Unfortunately, today was trying to find the solution to a problem and found a google link to the FreeCodeCamp forum where I saw other people’s projects, and to my surprise, none of the ones I saw were clones of the examples given.
My goal is to claim the responsive web design certification after finishing the five projects, but now I’m worried the three I have finished so far might be seen as having been plagiarized.
I use VSCode to write all my code, then fork the example given to get the test part going, and finally paste my own code to be tested.
The links to two of the projects I have finished so far are (as a new user I can’t post more than two links):

Yeah I would be concerned.

It’s good to receive inspirations from the pre-made templates but your work should be your genuine work. Your projects look much like existing ones. I would get creative and come up with your own projects.

  1. As long as your code is different, I’m not sure how much it matters that your projects look the same. I might be totally wrong, also where’s the fun in that. Give them your own style.

  2. Your input selectors are over complicated and the input[type=checkbox]:last-child is not doing what you want because the last child is a <br> element. You can use last-of-type in that case.

  3. You have margin collapsing.

If you want sibling elements that are stacked to have a 20px margin between them, give them margin-bottom 20px and then exclude the last sibling. Not only is it cleaner but you will also avoid margin collapsing.

You have collapsing margins on your row-* elements. I believe the reason why it’s not happening with your inputs is because of the br elements between them. I also think it makes the actual margin 18px, not 20px. Or at least giving them margin-bottom 18px seems to be visually equivalent.

Here is how i would do it.

/* Reset any default margins and set margin-right: 5px */
input[type="checkbox"],
input[type="radio"] {
  margin: 0 5px 0 0;
}
/* Set margin-bottom: 20px excluding the last-of-type
 * if you don't actually want 20px use 18px instead then it should look the same as before
 * that is except for the last-of-type fix which now has removed the margin-bottom from the last element
*/
input[type="checkbox"]:not(:last-of-type),
input[type="radio"]:not(:last-of-type) {
  margin-bottom: 20px;
}

/* The above input CSS replaces all your input CSS below */

/* input[type=checkbox]:not(first-child):not(last-child) {
    margin: 10px 5px 10px 0;
}

input[type=checkbox]:last-child {
    margin: 10px 5px 0px 0;
}

input[type=checkbox]:first-child {
    margin: 0px 5px 10px 0;
}

input[type=radio]:not(first-child):not(last-child) {
    margin: 10px 5px 10px 0;
}

input[type=radio]:last-child {
    margin: 10px 5px 0px 0;
}

input[type=radio]:first-child {
    margin: 0px 5px 10px 0;
} */


/* Give the rows 20px margin-bottom and width: 100%
 * shared styles are now combined
*/
.row-center, .row-top {
  margin: 0 0 20px 0;
  width: 100%;
}

.row-top {
  display: flex;
  justify-content: flex-start;
}

.row-center {
  display: flex;
  align-items: center;
}
3 Likes

youre only cheating yourself. the certification doesnt matter. the point is to learn how to do it yourself

If you did all of the code yourself and just used the same content, that’s fine (especially if you styled it your own way). The more of your own work and creativity involved, the more you’ll get out of the experience. You can always work on the projects more and resubmit them.

Thanks for your feedback! I made the changes you mentioned and read the article on margin collapsing. I’m going to have to do some more research on it as I’m not sure how to detect the problem and solve it.

I wrote all the code myself. I tried to make them look like the examples, but the code is 100% mine.

FreeCodeCamp is a place where you learn to code, not to design.

Knowing is half the battle. The best way to detect it is by using the developer tools. Using the DOM inspector and hovering over the elements, you can see the colored margin box around the elements, if two margins are collapsed the colored margin area will occupy the same area.

Yup, pretty useful tool. I just used it to fix some other spacing issues on my landing page. Thanks for the info!

Honestly, I checked out your projects. In my opinion, I would redo them to at least change the color scheme. There is really no way to tell that the work is genuinely yours, and therefore, could be considered plagiarism. I did my projects similar to yours the first time around, then re-did them - TWICE. I utilized Lorem Ipsum for my words because the structure and the styling are all that really matter. I provided my own color schemes but made sure that all the tests completed. That’s what is super important. And, at the end of redoing my projects 3x? I understand my projects better, and am a better developer because of it. Good luck. :slight_smile:

Thanks for your feedback! I followed your advice and ended up making some changes to them, included the color scheme. Also, for my technical documentation page I also used Lorem Ipsum. Nice tool!

In all fairness, regarding these projects, they are design. The certificate is even titled ‘Responsive Web Design’. The user learns how to build certain types of pages, and design them how they want.

Well, plagiarism is when someone takes another person’s work and claims it as their own work. If you didn’t do that, there is no plagiarism. Also, if you use code/content elements from another source, ask for permission. As soon as you have permission, there cannot be plagiarism. If a task instructs you to provide your own content, then you should do so.
Besides, there are only a finite number of ways that a particular task can be coded. At some point there will be code that is the same as another person’s, especially when using the same knowledge. The only thing you could change is the visual content.

Would getting help from sites like StackOverflow be plagiarism if you use code someone provided for you to solve a problem?

1 Like

I think you make a very important and valid statement when you say there are only so many ways something can be coded. If you are looking at somebody’s code in order to understand the correct sintax, that is not plagarism. If it was then evrerybody would be guilty of plagiarising the W3C.

1 Like

Indeed, W3C would be suing everyone if following standards were plagiarism.
I think that as long as the end result is not a duplication of an original code-set, it should be okay.
In some ways it’s the same as a normal spoken language; we all have access to the same words in that language, but if we put them all together to write a book that is exactly, or to a large extent, the same as an existing book, then plagiarism probably occurred.