Now you’re ready to actually start coding. You can develop websites either offline, by working with an editor, or online, with a web service such as Codecademy.com.
Especially if you have never done any coding before, you should code with access to an Internet connection using the Codecademy.com platform because you do not have to download and install any software to start coding, you do not have to find a web host to serve your web pages, and you do not need to upload your web page to a web host. As you code, the Codecademy.com platform will do these tasks for you automatically.
Working offline
To code offline, you’ll need the following:
Editor: This refers to the text editor you’ll use to write all the code, including HTML, CSS, JavaScript, Ruby, Python, and PHP. The editor you use will depend on the type of computer you have:
Browser: Many browsers exist, including Firefox, Safari, Internet Explorer, and Opera; however, use Chrome, because it offers the most support for the latest HTML standards.
Web host: In order for your website code to be accessible to everyone on the Internet, you need to host your website online. Freemium web hosts include Weebly and Wix; these sites offer basic hosting but charge for additional features like additional storage or removing ads. Google provides free web hosting through Sites and Drive.
Working online with Codecademy.com
Codecademy.com is the easiest way to start learning how to code online, and lessons from the site form the basis of this book. The site doesn’t require you to install a code editor or sign up for a web host before you start coding, and it’s free to individual users like you.
The site can be accessed using any up-to-date modern browser, but Google Chrome or Mozilla Firefox is recommended.
Touring the learning environment
After signing up or signing into the site, you will either see an interactive card or the coding interface, depending on the content you learn.
The interactive cards allow you to click toggle buttons to demonstrate effects of pre-written code, whereas the coding interface has an coding editor and a live preview window that shows you the effects of the code entered into the coding editor.
The coding interface has four parts:
Background information on the upper-left side of the screen tells you about the coding task you are about to do.
The lower-left side of the screen shows instructions to complete in the coding window.
The coding window allows you to follow the exercise instructions and write code. The coding window also includes a preview screen that shows a live preview of your code as you type.
After completing the coding instructions, press Save & Submit or Run. If you successfully followed the instructions, you advance to the next exercise; otherwise, the site will give you a helpful error message and a hint.
The interactive cards have three parts:
Background information about a coding concept.
A coding window to complete one simple coding task. A preview window also shows a live preview of your code as you type.
After completing the coding instructions, press the Got It button. You can review any previous interactive cards by clicking the Go Back button.
Receiving support from the community
If you run into a problem or have a bug you cannot fix, try the following steps
Click on the hint underneath the instructions.
Use the Q&A Forums to post your problem or question, and review questions others have posted.
Tweet the author at @nikhilgabraham with your question or problem, and include the hashtag #codingFD at the end of your tweet.