The goal of the Front End Web Developer Nanodegree program is to equip learners with the unique skills they need to build and develop a variety of websites and applications. Graduates of this Nanodegree program will be able to construct responsive websites using CSS, Flexbox and CSS Grid, develop interactive websites and UI (User Interface) applications using JavaScript and HTML, and connect a web application to backend server data using JavaScript. Students will also build competency automating application build and deployment using Webpack and improving offline performance of websites using Service Worker.
The following is a list of current projects required to complete the Front End Nanodegree.
- Personal Blog Website
- Landing Page
- Weather Journal App
- Evaluate A News Article with Natural Language Processing
- Capstone - Travel App
This project requires you to utilize your HTML and CSS skills to build out a personal blog website, including custom images, layout, and styling. Along with webpage design considerations, you'll work to appropriately structure your files, as well as use proper CSS and HTML formatting & style. Create a multi-page blog website, using best practices for content and page styling with HTML and CSS. You’ll practice using responsive layouts, Flexbox, and CSS Grid to create the structure and design for your own blog.
No installation, it's only html files.
Simply clic on index.html
In this project, you will be building a multi-section landing page. Often times, you won’t know how much content will be added to a page through a Content Management System (CSM) or an API. To handle this problem, you will dynamically add content to a web page. You’ll be building a landing page that combines your skills with JavaScript, HTML, and CSS to update and control the page and create a dynamic user experience.
- Navigation is built dynamically as an unordered list.
- It should be clear which section is being viewed while scrolling through the page.
- When clicking an item from the navigation menu, the link should scroll to the appropriate section.
No installation, it's only html files.
Simply clic on index.html
Apply your new skills to combine data from the OpenWeatherMap API and client side (browser) HTML forms to create a web app that records a weather journal for users. This project requires you to create an asynchronous web app that uses Web API and user data to dynamically update the UI for a Weather Journal App.
- How do I setup a Node environment with Express and the necessary project dependencies?
- How do I setup a server with GET and POST routes?
- How do I create developer credentials for a Web API?
- How do I use the Fetch API with my credentials and user input to get dynamic data into my app routes?
- How do I access a GET route on the server side, from a function called on the client side?
- How do I chain Promises together
- How do I access HTML elements with JavaScript and set their properties dynamically?
Having node and npm installed.
Use the following command on your terminal
npm start
Simply navigate to http://localhost:9000
Build a web tool that allows users to run Natural Language Processing (NLP) on articles or blogs found on other websites. Using an exciting new API called Aylien, you can build a simple web interface to interact with their NLP system. This tool will give back pertinent information about the article: whether the content is subjective (opinion) or objective (fact-based) and whether it is positive, neutral, or negative in tone.
=> More info on Project 4 Readme
In the final project, you’ll combine all of the skills you’ve developed throughout the Nanodegree program to build an online travel app. You’ll work with data sources from multiple APIs to create a dynamic travel weather planning application that helps people plan trips by generating weather forecasts for the places they’re visiting. The design is up to you, and you’ll have the flexibility to include and combine other APIs (even your own!) to build this final project.
=> More info on Project 5 Readme
See below for the Udacity Style Guide used thoroughout the Front End Nanodegree.