Decide what you want to create. Do you have an idea for the next big social network? Do you have an idea for a great app? A useful tool that you’ve always needed and not found anywhere? If you think there’s a need for it and it doesn’t already exist, you can be the one to create it. Your app might be something that your family / job / journey to work has inspired you to create. For example, top model and longtime coder Lyndsey Scott created an app for her ‘book’ - the portfolio of photographs, campaigns and experience that models take along to fashion castings to give casting directors an idea of what they’ve done before. The app is called iPort, which allows models to upload their ‘book’ or portfolio onto an iPad. She said: "I built that app because it was something I personally needed,’ she said. ‘My book always ends up looking terrible, the books fall apart, the pages are tearing, it’s dirty, and it’s a mess."

Copy cool things you find on great websites like widgets, videos, parallax images etc. (do view source on a page). Add it to your code. Then try to understand what it is doing. This is a great way to learn any new skills and impress your friends by having something advanced to show at a relatively early stage in your learning. Websites like TryRuby are great for practicing what you’ve learnt directly in your browser without having to download any software.

Martin Ramsin, our CTO and co-founder at CareerFoundry, first learned to code using Codecademy and free tutorials. He found these online resources helped him with learning syntax but found the real difficulty occurred when he was trying to find out which tools to use, how to deploy, understand Git, etc. In other words, how to work as a web developer. Raffaela - CareerFoundry’s CEO and co-founder - and Martin founded CareerFoundry based on these observations as they realised that students need more than just tutorials to learn web development. They also need the support and expertise of someone who has already been there. It is for this reason that our mentors are at the centre of everything we do. While you are learning to code it’s crucial to have someone you can ask direct questions to about the small, fiddling things to do with programming, but what’s also invaluable is having someone on-hand who can give you advice in your career, help you build a portfolio or find work. We put together a list of 20 ways you can learn to code, so have a read and find out which option is best for you. At the end of this post we'll also be reviewing the best online and offline schools for learning to code. As David Shariff, Senior Engineer at Yahoo told us: "Don't settle for knowing a concept, roll your sleeves up and dig as deep as you can."

Someone once told me that when you’re learning how to program you really learn how to Google stuff like a pro. This is a key skill as a developer. All of the answers you need to any question you might have you will find online, but knowing HOW and WHERE to find them is the tough part. You need to learn exactly which search terms are going to get you the answers you need, whether you find them on GitHub or StackOverFlow or on some obscure forum. When you understand how to Google for things you’ll find learning code will be much faster. It is part of the learning process to get from problem to solution in as little time as possible - and when you are under pressure in a real, working environment this skill will be invaluable.

A front-end developer is a web developer that codes the front end of a website. While web design is the way a website looks, front end development is how that design actually gets implemented on the web.

A back-end developer is someone who builds and maintains the technology needed to power the components which enable the user-facing side of a website to exist. Their back end code adds utility to everything the front-end designer creates.

Full stack developers understand how every part of the web development process takes place and can guide on strategy and best practices. These developers will have an increasingly important role in the web development of the future, and are able to look at the 'big picture'. They are knowledgeable with the server side as well as the client side’s user experience.

JavaScript (JS) is a type of web programming language that is supported across all web browsers and tools, and is the language that gives JavaScript developers control and power to create, enhance and modify websites. Even though a JavaScript developer typically works on the front-end, the programming language itself is not limited to front-end use only.

The big question: money. According to PayScale.com, the 2015 median annual pay for web developers is $56K, while the median annual pay for web designers is around $46K. Robert Half Technology offers a more optimistic outlook, citing 2014 survey results to determine a $70-110K annual salary for web developers and $60-$99k annual salary for web designers. However, this is subject to many variables including location, experience, skillsets, and maybe even what you wear for that job interview. Just know there isn’t much salary discrepancy between the two web careers.

Web developers work with programming languages like HTML, CSS, and Javascript to create websites and web applications. They will also most likely utilize other languages to set up email services, user authentication, databases, and other technical aspects of websites. To do this, developers use software like text editors, command line interface, and version control to build the technical information (the code) that will present the data. Web designers are not primarily responsible for knowing how the code works – but making sure it’s aesthetically pleasing and user-friendly for website visitors. They will utilize graphics design software – including products like Adobe Photoshop, Illustrator, Inkscape (an excellent alternative to Photoshop), and GIMP. Ultimately, they will design the layout of the website through constructing prototypes and wireframes. Designers control the flow of information and can even be responsible for website analytics.

A portfolio is very important – whether you’re a developer or designer. Unlike that disclaimer you see on your stock investments, past performance is a pretty good indicator of future performance. A good developer and designer will showcase their skillsets and experience for future employers and clients, but may make use of different services to do this. Developers will primarily rely on GitHub.com to display their awesome repositories of coding work. It’ll demonstrate how well the developer can refactor and abstract their code to be elegant and readable to other developers. Cloud-based website-hosting services like AWS (Amazon) and Heroku.com can be used at times to display static websites and web applications that developers have created. Designers have their own options to show off their ingenuity through websites like Behance.com and Dribble.com. These websites offer the ability to present designers’ expertise in color schemes, graphic design ability, and creativity. Even more important than utilizing these resources is creating a personal portfolio site that you can showcase your work. By creating a personalized website, you have control over how your information is presented and received, without inviting the interference that comes up at times by hosting your content on a third-party website. Nevertheless, don’t neglect these other resources and make sure they are utilized in some capacity.

When drawing the comparison between developers and designers, the “right-brained” (imaginative) vs “left-brained” (logical) comparison is occasionally made. It is said that people who think more linearly and logically are left-brain dominant and will enjoy and be more comfortable with web development, while people who enjoy creativity and possess an artistic nature are right-brain dominant and will flourish in web design. However, there have been studies done that show people don’t have a dominant part of their brain – as Neil deGrasse Tyson put it, “Don’t call me left brained, right brained. Call me human.” Don’t think you’re predisposed to do better in one area than another – an artist can be as proficient at web development as a mathematician can be as creatively skilled at web design. This segues excellently into my final point.

LTFB – Learn the f* basics. Any further tip is useless if you do not know the basics of web development. If you find yourself struggling with programming and design, I’ve got some nice getting started guides for you on this blog. Try to pick a few topics and make yourself comfortable with basic requirements in web development. Learn how to code in HTML, CSS & JavaScript To learn the basics of programming, I’d recommend taking an online course. There are tons of great programs to choose from out there: Hop over to treehouse or code academy and check out their classes. There are different classes available on how to get started with HTML and CSS, JavaScript, jQuery, and many other programming languages. Start with classes in HTML, CSS, and JavaScript and start exploring and building your own websites by creating a few static web pages. After making yourself comfortable with HTML, CSS, and JavaScript, you could move on to learning about Ajax and jQuery, for example. Learn how to design Getting started in web development also requires some basic understanding of good design. Besides making yourself familiar with some design tools, I’d recommend learning the basic concepts of design. Learn how to think like a designer. Teamtreehouse, for example, offers some great classes and materials on design. Lynda.com is another great resource. Further educational resources Learn a new programming language within 1 month Great tutorials on design & web development at lynda.com Learn how to code with Code School

When starting out in web development, you’ll be reading a lot of articles and books, as well as other people’s code. You don’t have to come up with something nobody has ever seen before. There are tons of (open source) projects, code snippets, and free libraries available that you can use to build your first projects. You can gain a lot of inspiration from looking at the work of others. Great ideas come from building on the ideas of others. Further resources for research & inspiration: Make use of code snippets on hsnipt.net Discover the community of web developers on github.com Find some design inspirations on pinterest.com Check out the search engine for design ideas at niice.co

Starting out in web development isn’t expensive Apart from your hardware. There are some great software products out there that you can use for free. However, it’s not easy to decide which people and resources to follow, when there are tons of them out there. Check out our post about the 12 best web development blogs which can provide you great insights and updates on any topic in web development. Explore different Quora threads on a variety of web dev topics. I’d recommend taking a look at the following Quora threads: Best blogs to follow How to start in web development Build a network of people you follow on Twitter and GitHub and try to engage in relevant conversations. Explore new resources, tools, and content on Product Hunt, dzone, Reddit and hacker news. Whether you’re looking for free stock images, free design or dev tools, I’d recommend taking a look at the following collections of free resources: Curated collection of tools for design, development and business: toolr.co List of free tools to build your startup: startupstash.com Further collections of free stuff: 200+ free tools for web developers: https://medium.com/@ti_asif/200-best-free-tools-resources-for-front-end-web-developers-3fb3c415a643 300 free things for design, web dev & business: https://medium.com/everything-about-startups-and-entrepreneurship/300-awesome-free-things-e07b3cd5fd5b 50 free web design tools: http://www.creativebloq.com/design/50-free-web-design-tools-rock-3126412

These days, with ever-changing “design standards” it’s not only important to learn the basics of good design, but also to keep your design skills up-to-date. It doesn’t matter how good you are today but how fast you improve your design skill every day. I really like these 17 tips from wikiHow on how to improve as a designer. Get a design tool For more and more web designers, Sketch has become the successor of Photoshop. I, personally, think it is more intuitive and easier to learn than Photoshop. Check out some free tutorials, which can save you a lot of a time.