I just started using FCC and am building my own portfolio right now, but shouldn’t I make my website outside of Codepen so I can learn how to use text editors, set up a server, etc?
1 Like
First off, welcome to FCC!
You have the right idea - yes you should know how to and practice making a website outside of Codepen.
Codepen is useful to showcase your code. I think FCC uses it so students can share their projects. With Codepen, anyone can easily examine your HTML, CSS and JavaScript. They can even play around with it.
2 Likes
Codepen technically functions as a code editor is it’s not too far off from using an offline text editor.
Depending on your taste, it can be nice to look at and has nice UI. In an industry that puts so much priority on UI, why shouldn’t web developers work in an environment that’s easy on the eyes?
It’s also a community where you can view other people’s codes/design and take inspiration, and vice-versa. This isn’t just for beginners. Some great designers like Sarah Drasner swear by it.
You could easily export a pen as a zip to your PC. You could also link Codepen to your GitHub profile and export any pen as a gist. You can even simulate working with different files by importing your other pens’ HTML/CSS/JS directly into another pen, or by using the new Codepen Projects environment.
It makes the process easier but I don’t think it cripples anyone and stops them from working outside of it.
Baby steps. The goal isn’t to make you use one tool for the rest of your life, but Codepen makes it very easy for beginners to get coding. It also makes it very easy to give and receive feedback or help when you can share an entire project with one link. Eventually, you’ll be ready to get your site hosted for really-reals.
3 Likes
Codepen is great because it handles some of the details so you can focus on the coding and it works great for simple projects.Plus, you don’t have to pay to get some web space.
Yes, when you go to try to write your own web page outside of codepen, there are a few things you need to figure out, but it isn’t much.
I think this approach is good, but it would be nice if there was a lesson at the end of the FE section that said, “OK, now you know how to build something in codepen, here is a quick overview of what you need to know if you want to build something in the ‘real’ world …” But really, it’s not that difficult.
Personally I prefer to use Atom (free editor) or sublime (paid). I edit all my code there… And once I’m done I’ll paste it into code pen (separating the html css js).
I find codepen way too sluggish to code in.
Having said that… I think codepen is a great tool to easily share code, especially when asking someone else for help.
Atom (http://atom.io) mac/Linux/win & its free and just as good as sublime
Sublime https://www.sublimetext.com
Some situations where atom is much better.
Say your working on a list.
I’d write all the list items (say 10)without the list item tags
Then select all the items
Hit cmd + shift + L
Atom now has a cursor on every line simultaneously
And then when I type the list item tags their applied to all the lines at once in the right place.
In code pen you can’t do that.
You can see an animated example of this here
https://www.sublimetext.com (2nd slide)
(atom can do it too)
2 Likes
I think features that plug in all the codes for you like that are great, but…I think when learning how to code, its better to actually write the code yourself so that you know how to do that step first before finding shortcuts to not have to do it.
Codepen serves a really good purpose here in a learning environment, like others said…if you hit a problem, others can easily ses and play with your code to give you some tips on where you went wrong. Or…inversely, someone who is struggling can play around with your code and learn from it. So, that is probably why…it makes the job of reviewing our code and getting help pretty efficient.
Also, its all inclusive, since its on the cloud, anyone can pop on and start learning and get the thrill of developing right away to see if this is even something for them. And if so…then its natural progression to move on to deciding what tools you want to use. There are so many editors out there that is really up to personal preference to find and decide for onesself.
If you’re already experienced and have a fav editor you want to use, then yeah of course…do that and transfer your code over to codepen to submit your project. But if you are just now learning the basics, take things step by step.When I first started out, I taught myself using only notepad. I dont know if anyone even uses that anymore…!!
2 Likes
I have the same question. Total greenhorn, but have Visual Studio & VS code and know my way around them, thanks to playing with C++, JavaScript, HTML 3, SQL and Visual basic a few years’ back. My current VS & VS code are new, I should say that. I also have a server.
Aside from passing the FCC tests for the code challenges, are there any viable reasons to use Codepen?
A good reason might be, employers scour the projects looking for new developers… The help community is better than other places, and so forth.
Thank you all so much, and sorry for reviving a very old thread.