Front-end. Visual, Dynamic, Interactive

Prepare yourself, we’ve hit a milestone in our web development journey—we’ve reached the front-end. So far we’ve introduced browsers, HTML, CSS, and JavaScript. When you package these languages together and run them in the browser, they make up the front-end. Let’s take a step into the user experience.

fullstack-infographic-week-3-javascript_160329-1

Front-end

The front-end, also referred to as the client side, is the visual, dynamic, and interactive face of the web. It’s where the browser combines HTML, CSS, and JavaScript to create the entire user experience. HTML and CSS bring structure and style to a web page, while JavaScript is used to make the site interactive and, in certain instances, serve as a connection between the front-end and back-end when data needs to be served to the page.

What is a Front-End Developer?

Front-end developers shape the entire user experience on a website. They are responsible for the layout, style, and features on a web page.

Front-end Developers:

  • Shape the user experience on a website
  • Proficient in HTML, CSS, and JavaScript languages
  • Knowledge of common design principles–typography, 2D design, color theory, and illustration design.
  • Have an understanding of the DOM – Document Object Model
  • Provide website maintenance
  • Assist back-end developers with coding and troubleshooting
  • Create quality mockups and prototypes
  • Have the ability to adapt and to learn new languages and programs
  • Collaborate with other teams and stakeholders

Common tools front-end developers use are Debugger for testing code, Mocha, Chai, Jasmine for JavaScript syntax testing, Balsamiq for wireframes, and ChromeDev Tools as a playground to test what works and why something isn’t working.

Fitting in the Full Stack

Learning and developing HTML, CSS, and JavaScript skills early in the Galvanize Web Development Immersive program are essential to front-end development. Alongside the core front-end languages, students learn programs like Angular and React to help build frameworks and make apps run more efficiently in the browser.

One of the top challenges students face in learning front-end development is keeping up with an environment that is constantly changing. Developers don’t just learn one language, like JavaScript, and write that for the rest of their career. They learn JavaScript, then learn various programs and languages in conjunction with it. Having the skills to learn and pick up programs and languages quickly is a huge advantage to being a successful front-end developer.

“We design the curriculum around teaching students how to solve problems,” said Zach Klabunde, Galvanize Web Development instructor. “We encourage students to learn a new technology that hasn’t been covered in the program and design applications around it. This sets students up for learning a new technology on their own and in their next career.” 

Continued Learning

Want to start learning front-end web development? Resources like TodoMVC, Egghead, Code Comba, and Coursera are great tools to help you get started.

Stay tuned. Next, we’ll go behind the scenes with the back-end.

Contributions by Zach Klabunde, Galvanize Web Development Instructor. 

Want more web developer tutorials and content? Subscribe to our web development newsletter.

404

Sorry, an error occurred.

Form not found.

We Hack the Future

Transform Tech from Within with Software Engineering Bootcamps

Not sure if a bootcamp is your next step? Sign up for an info session or schedule a 1:1 Q&A with an advisor to learn about our programming.