Développement

JavaScript React Developer

Create website interfaces, styles, and animations like the ones you know and use
everyday.

Apprenticeship Average duration

Path duration: Hired or Bachelor's-level
duration: of full-time study:
800 hours refunded** diploma*
24 months 12 months

*Développeur concepteur logiciel - NSF 326t - Level 6 (Eu) 6 (UK) Bachelor's-level diploma (Fr) - filed in the RNCP by
ministerial order 10/15/21 officially published on 10/15/21
** Conditions available at https://openclassrooms.com/en/terms-of-sale
What is the JavaScript React Developer role?

JavaScript React developers, also known as front-end developers, are in charge of

creating dynamic websites using a programming language. They take care of the
front-end part, i.e. the visual side of the site, unlike the back-end developer. To find out
more, you can read this article on developer jobs.

A front-end developer’s missions typically entails:

Understanding the project they’re working on to develop the most satisfying

features and interfaces for their client.
Implementing mockups with a keen eye for detail and rigorous standards.
Using best practices to structure HTML, CSS and Javascript code.
Using frameworks such as React to build powerful and modular applications.
Using tests to monitor their applications and ensure the highest quality service.
Providing technical and functional documentation of the site for their clients
and colleagues.
Optimizing page load time.

Why take this program?

“Developer jobs have been growing enormously in recent years. No longer

reserved only for digital companies and for men, now all companies need
JavaScript Developers for their website, internal tools, mobile apps for
marketing, etc… And female developers are in high demand now! It's a job in
constant change and that offers many openings to various jobs, some of
which do not even exist yet. We are proud to offer this training path,
accessible to all, opening the doors to the job of Front-End Developer.”

— Clara Corazza, Head of the Code track at OpenClassrooms

JavaScript React Developer 2

This program was created by our instructional design team. Our pedagogical method
is based on the realization of real-world projects and one-on-one, weekly sessions with
a professional web development expert as your mentor.

The idea is simple: to learn effectively, it is important to be active in your learning.

Within this path, this involves completing projects based on scenarios from the
professional world. Your mission: look for solutions, create your deliverables and
present them convincingly in front of your mentor! You will be able to directly apply the
experience you gain through your OpenClassrooms program in your future workplace.

The training consists of professional projects of increasing complexity. Each project will
allow you to acquire specific skills.

What you will learn

Setup your development environment.

Implement a responsive layout with HTML5 and CSS3.
Ensure the accessibility of a website.
Create dynamic web applications with Javascript, React and APIs.
Ensure data quality in a web application through testing.
Contribute to a code project using agile methodology...

... And much more!

At the end of this training, you will be a full-blown JavaScript React Developer, and earn
your European diploma for Software development.

Salary of a Front-End Developer

Web development can be a lucrative career with many prospects and income growth
opportunities opening up as you continue to acquire more experience. Here is what
you can expect to earn in your career as a Front-End Web Developer:

United Kingdom

Beginner: £30,000 - £40,000

2-5 years: £40,000 - £60,000

5+ years: £60,000 +

United States

Beginner: $40,000 - $60,000

JavaScript React Developer 3

2-5 years: $60,000 - $80,000

5+ years: $100,000 +

You will be able to work as a React Developer or Front-End Developer, but also as a
Web Developer, or Javascript Developer.

This program can be taken as part of an apprenticeship. For more information, please
contact us.

Career development

You will also be able to quickly ascend towards other developer jobs using Javascript as
your primary programming language. For example, you could become a mobile
developer using React Native or a Back-End Developer with Node.js.

As a JavaScript developer, you will be able to evolve in several ways, including :

Diversifying your technical skills to become a full-stack developer, i.e. covering

both the back end and the front end.
By specializing in a particular technology; React in this training but there are
plenty of others!
After a few years of experience and collaborating with many other developers,
you may also choose a more managerial role as a Lead Developer or a CTO.

Prerequisites

To be eligible to earn this path's diploma, candidates must demonstrate proof of one of
the following prerequisites:

an associate's degree, or equivalent, in computer science, web development, or

software development
or a high school/secondary school degree, vocational certificate, or equivalent,
and at least 2 years of professional experience in IT, web development, or software
development

All other candidates will need to go through a specific admissions process. These
candidates must have:

an associate's degree, or equivalent, in any subject and at least 1 year of

professional experience in any field
or a high school/secondary school degree, vocational certificate, or equivalent in
any subject and 3 years of professional experience in any field
and a completed placement test consisting of:

JavaScript React Developer 4

 OpenClassrooms course completion certificates from Build Your First Web
Pages With HTML and CSS, Think like a computer: the logic of
programming, and Manage Your Code Project With Git & Github
a personal programming project, accompanied by a 10-minute recorded
video that explains the project itself and the code behind it

For all candidates, the admissions process starts with a form to validate the
aforementioned prerequisites, as well as the alignment between the candidate's
professional goals and this path. Any necessary documents for the candidate's
application will be collected via this form. If necessary, an individual interview with the
candidate will also be organized.

Language: Candidates whose native language is not English will need to submit
proof of a B2 English level on the CEFR scale, an IELTS band score of 6.5, or a
TOEFL score of 80.
Equipment: Candidates must also have access to a computer (PC or Mac),
headphones, a microphone, a webcam, and a good internet connection for
mentoring sessions (3.2 Mbps upload and 1.8 Mbps for download). In addition, to
master the skills on this path, you will need to:
Have at least 8 GB of RAM (16 GB is more comfortable) and 100 GB of storage
space available on your computer.
Have administrator rights to your computer in order to install required
programs.

How will I learn at OpenClassrooms?

Our learning method is unique and revolves around two elements: professional
projects and dedicated mentoring sessions.

Projects

At OpenClassrooms, learning is project-driven because that’s the fastest way to

become proficient. Projects offer hands-on experience so you can hit the ground
running when you start your new job.

The JavaScript React Developer path has a series of projects that you’ll need to
complete one at a time with the support of your mentor. You’ll receive a detailed brief
with the context, customer requirements and additional details. Then it’s up to you to
go and make it real! To do this, you’ll have to be creative, coming up with innovative
solutions to the questions at hand.

Want to know more about projects? Read our blog post here.

JavaScript React Developer 5

Mentorship

During your path, you will be assigned a mentor who will offer one-to-one support via
weekly video conference sessions. This mentor will offer guidance on your projects,
help define objectives and guide you until you reach them. Our mentors are dedicated
professionals who are experts in their field and have experience in sharing their know-
how with our students.

JavaScript React Developer 6

Project 1 - 8 hours

Take Ownership of Your

Learning on the Front-End
Path
In our changing world, being skilled in learning is more important than ever.
Become an active, autonomous learner to set yourself up for success on this
path and in your future career.

Skills
Develop a personalized learning plan and toolset

Associated courses

Learn How to Learn

Easy 6 hours

The ability to learn quickly and effectively is a key skill that can
open the door to any domain or career throughout your life.
Follow this course to improve your learning capacity and to
take control of your personal and professional development!

Understanding the Web

Easy 4 hours

Does the web interest you, but you aren’t totally clear on how
the whole thing works behind the scenes? Learn internet
history, vocabulary, logistics, and more with this course!

JavaScript React Developer 7

Stay Up to Date With Innovations in Your Field
Easy 4 hours

Learn how to stay abreast of industry changes, pinpoint areas

for professional development, and work more efficiently in the
digital age.

JavaScript React Developer 8

Project 2 - 70 hours

Turn Mock-ups Into a Web

Page with HTML & CSS
Get started with HTML & CSS by implementing a travel booking platform's
website from scratch.

Skills
Integrate web content according to a mockup using HTML & CSS
Implement a responsive layout

Associated courses

Set Up Your Front-End Development Environment

Easy 4 hours

The front-end developer, as other jobs, has a corresponding

toolset. In this course, you'll install and begin to explore the
tools you'll use throughout your career as a front-end
developer.

Build Your First Web Pages With HTML and CSS

Easy 10 hours

Learn to create your first web pages using HTML and CSS, the
two most important languages on the web. No coding
experience required!

JavaScript React Developer 9

Create Web Page Layouts With CSS
Easy 10 hours

Go beyond basic HTML and CSS skills and learn how to create
great layouts using CSS layout techniques!

JavaScript React Developer 10

Project 3 - 90 hours

Integrate a mobile website

with animations in CSS
Implement the mobile version of this foodtech website with CSS animations.

Skills
Set up a development environment
Track a code project with version control on GitHub
Develop a navigation structure for a website
Implement design effects using CSS & Sass
Ensure design consistency on a website

Associated courses

Produce Maintainable CSS With Sass

Medium 15 hours

Learn to write clean, maintainable, and modular CSS code

through the implementation of designed naming and file
structures, such as BEM, and the use of Sass, a CSS
precompiler.

Create Modern CSS Animations

Medium 15 hours

By animating elements of a web page, we can guide the

attention of our visitors, creating a more fluid user experience.
Take your CSS skills to the next level and bring your web pages
to life with modern CSS animations!

JavaScript React Developer 11

Learn the Command Line in Terminal
Easy 4 hours

The command line in Terminal is where a lot of programming

efficiency happens. Take this course to better communicate
with your computer!

Manage Your Code Project With Git and GitHub

Easy 6 hours

Install Git and GitHub and learn basic Git commands to

manage your code and deploy your development projects.

JavaScript React Developer 12

Project 4 - 30 hours

Build a Landing Page Using

Javascript
Get started with Javascript on this gaming company's website, GameOn. In this
first programming project, you'll discover how to code with Javascript from
scratch.

Skills
Program using fundamentals of JavaScript

Associated courses

Learn Programming With JavaScript

Easy 15 hours

Build a strong foundation in web development by learning

and practicing JavaScript, one of the major programming
languages on the web. You'll even create a simple application!

Write JavaScript for the Web

Medium 10 hours

Use your JavaScript skills to build interactive, dynamic web

apps. Learn to interact with your users and to leverage external
APIs to build rich, immersive user experiences.

JavaScript React Developer 13

Project 5 - 1 hour

Skills Checkpoint: Web

Languages Proficiency
Test your skills on HTML, CSS and JavaScript language principles and
paradigms;

Skills
Write HTML, CSS and JavaScript syntax

JavaScript React Developer 14

Project 6 - 70 hours

Create an Accessible Website

For a Freelancer Sourcing
Platform
Delve into Javascript with Fisheye to build this freelance photographer
platform. Be sure your code makes this web app accessible to all.

Skills
Develop a modular app with design patterns
Ensure the accessibility of a website
Manage website events
Write maintainable JavaScript code

Associated courses

Make Your Web Content Accessible

Easy 6 hours

How do people with disabilities interact with the web using

assistive technologies? In this course, you'll assess for web
accessibility barriers using the Web Content Accessibility
Guidelines (WCAG) and design with digital inclusion in mind,
from visual design to interactions.

Code an Accessible Website in HTML & CSS

Medium 6 hours

Apply digital inclusion principles in your HTML & CSS code using ARIA, alt tags,
and other digital accessibility tools. Learn to comply with the W3C WCAG (Web
Content Accessibility Guidelines) as a developer.

JavaScript React Developer 15

Project 7 - 90 hours

Develop a Search Tool with

Bootstrap
Implement a search algorithm for Les Petits Plats, a recipe website. You will use
Bootstrap to build the interface and advanced Javascript methods and tools for
optimization.

Skills
Deconstruct a computational problem
Develop an algorithm to solve a problem

Associated courses

Create Responsive Websites Efficiently With

Bootstrap 4
Medium 12 hours

Bootstrap, a popular CSS framework created by Twitter

developers, will save you design time and allow you to quickly
build attractive, responsive websites! Learn the latest version,
Bootstrap 4.

JavaScript React Developer 16

Project 8 - 1 hour

Skills Checkpoint: JavaScript

Algorithms
Test your skills in Javascript algorithms to be ready for technical tests.

Skills
Write Javascript syntax using a programming paradigm

JavaScript React Developer 17

Project 9 - 60 hours

Debug and Test an HR SaaS

The expense report app, Billed, is experiencing a handful of bugs. You'll have to
fix as well as write new unit and integration tests to detect future problems.

Skills
Debug a web application
Write a manual E2E test plan
Write integration tests with JavaScript
Write unit tests with JavaScript

JavaScript React Developer 18

Project 10 - 50 hours

Define User Needs for a

Tutoring App
A non-profit that tutors children needs your help. Determine their needs and
create a plan to tackle them using agile tools such as, User Stories, mock-ups, a
Kanban table and use case diagrams.

Skills
Create a mockup for a client
Identify functional application requirements based on client needs
Manage a code project using agile methodology
Model a technical solution for a client using domain models

Associated courses

Manage your code project

Easy 10 hours

Writing code is great, but you've gotta keep an eye on what

you're doing! You'll need to manage your project (whether
using Agile, Scrum, or a different workflow) from start to finish
in order to hit your deadlines and keep everyone happy.

Learn About Agile Project Management and

Scrum
Easy 6 hours

Learn the principles of agile software development. Discover

how a Scrum Team plans a Sprint, builds feedback, creates
retrospectives, and holds daily stand-ups.

JavaScript React Developer 19

 Create a Business-Focused Client Brief
Medium 8 hours

To create software architecture, you'll first need to synthesize

client needs. Learn to apply structural guidelines, stakeholder
management, and agile methodology to interpret and
construct an effective functional project brief.

Create Simple Prototypes With Wireframes

Medium 15 hours

Use wireframes to communicate how a website or app will

work. Diagram user flows to make sure the steps are all in
place.

Apply a Domain-Driven Design Approach to

Development
Easy 4 hours

Use DDD to communicate the technical architecture to the

various stakeholders in your project, and learn functional
modeling using UML use-case diagrams and class diagrams.

JavaScript React Developer 20

Project 11 - 60 hours

Develop a Web App with

React and React Router
Implement the front end of Kasa, a person-to-person, real estate rental app. For
this client, you will create components with React and build the routes of your
app with React Router.

Skills
Create React components
Develop the routes of an application with React Router
Initialize a React web app

Associated courses

Create a Web Application With React.js

Medium 8 hours

Discover React.js, the Javascript library that allows you to

create apps from components. Learn the basics while using
the Create React App tool (CRA) to build a complete web
application!

Intermediate React
Medium 12 hours

It’s time to take simple React apps to the next level! In this
course, we’ll build a single-page application with routing,
personalized hooks, and tests.

JavaScript React Developer 21

Project 12 - 60 hours

Develop a Dashboard for

Analytics with React
Create the consumer-facing dashboard of a sports analytics platform, SportSee.
Build graphs and charts with React and use an API to fetch data.

Skills
Develop advanced graphics using libraries
Ensure data quality in a web application
Interact with a web service
Produce technical documentation for a web application

Associated courses

Build Your Web Projects With REST APIs

Easy 4 hours

Enhance your web projects with REST APIs by accessing data

that can be integrated into your own applications. APIs will
add a whole new dimension to your software!

JavaScript React Developer 22

Project 13 - 100 hours

Connect to a Back End with

an API Using React
Remede Agency needs you to complete their website's code to communicate
with the back end. You'll write REST API calls to connect the front end to the
back end of the website and model new API endpoints.

Skills
Interact with an API
Authenticate to a secure API
Create API models
Implement a state management system in a React app

JavaScript React Developer 23

Project 14 - 110 hours

Convert a jQuery Library to

React
Help refactor HRnet's website. You will choose a jQuery library and turn it into a
React plugin. Use LightHouse to monitor the performance of your new code.

Skills
Monitor the performance of a web app
Code in JavaScript with functional programming
Deploy a front-end web app
Refactor an application to reduce technical debt

JavaScript React Developer 24

 lternance
OpenClassrooms, 1ère école en ligne
à proposer des formations diplômantes

L'alternance en ligne permet à l'entreprise et à l'étudiant de trouver le meilleur

rythme adapté à leurs besoins respectifs.
Côté étudiant :
une formation diplômante
et 100% financée
L'alternance est une modalité de formation qui mêle acquisition des
connaissances (en ligne) et des compétences (en entreprise).

Comment se déroule Est ce que la

un parcours en formation en
alternance alternance a un coût
OpenClassrooms ? pour l'étudiant ?

Après avoir choisi le parcours de La formation en alternance est

formation qui lui convient, l'étudiant gratuite ! Une rémunération est
bénéficie d'un accompagnement également prévue : jusqu'à 100% du
gratuit de 2 mois pour trouver son SMIC en fonction de votre âge et de
entreprise. votre année de formation.

La formation peut se réaliser en contrat Pour se lancer, une seule adresse :

de professionnalisation ou openclassrooms.com/fr/apprenticeship
d'apprentissage. Rendez-vous à la page
suivante pour savoir lequel choisir !
Côté entreprise :
l'accès à des profils qualifiés
toute l'année, en toute
simplicité !
OpenClassrooms est la 1ère école en ligne à proposer des formations en
alternance, aux titres reconnus par l'État de niveau Bac+2 à Bac+5, sur des
métiers en tension, très recherchés par les recruteurs. Les formations en
alternance peuvent être financées, soit par la taxe d'apprentissage, soit par
les OPCO (Opérateurs de Compétences).

Comment lancer des Quand peut-on

parcours lancer une démarche
d'alternance au sein d'alternance au sein
de l'entreprise ? de l'entreprise ?

Pour chercher des profils à recruter en À tout moment : le contrat peut

alternance ou lancer le recrutement d'un démarrer tout au long de l'année, il n'y a
étudiant déjà identifié, n'hésitez pas à pas de date de rentrée imposée.
contacter :
job.placement@openclassrooms.com

Les équipes d'OpenClassrooms vous

accompagnent à chaque étape d'une
démarche d'alternance, du dossier de
financement au suivi de vos alternants.
Pourquoi l'alternance
en ligne ?
Les avantages de l’alternance OpenClassrooms sont nombreux : date de début
flexible, formations créées par des experts métiers, accompagnement
personnalisé, formation financée...
1. Une formation gratuite 2. Une solution flexible,
pour l'étudiant et financée adaptée aux besoins de
pour l'entreprise l'étudiant et de l'entreprise

La formation est gratuite. Le contrat peut démarrer à tout

moment de l'année.
Dans le cadre d'un contrat de
professionnalisation, elle est 100% Il est possible de faire soit un contrat
financée par votre OPCO. de professionnalisation, soit un contrat
d'apprentissage.
Dans le cadre d'un contrat
d'apprentissage, elle est financée par la Le(s) jour(s) dédié(s) à la formation est
taxe d'apprentissage que paient les (sont) flexible(s) en fonction de
entreprises privées. l'organisation de l'étudiant et de
l'entreprise.

3. Une formation de 4. Un accompagnement

qualité, conçue pour une dédié à chaque étape,
application directe au sein pour l'étudiant comme
de l'entreprise. pour l'entreprise

Les formations OpenClassrooms sont Des profils d'étudiants disponibles et

professionnalisantes. Elles sont conçues pré-sélectionnés par nos experts pour
par et pour l'entreprise, sur des métiers répondre à vos besoins en recrutement
recherchés. sur toute la France.

Les formations OpenClassrooms sont Un accompagnement par nos

de qualité, avec des diplômes inscrits au conseillers pédagogiques à chaque
RNCP (Répertoire National des étape de l'alternance.
Certifications Professionnelles) et dont
Un point de suivi hebdomadaire par un
les niveaux sont reconnus par l'État.
mentor individuel pour motiver
Une plateforme collaborative favorise l'étudiant et l'accompagner pendant
les échanges entre apprentis et aide à la toute sa formation.
recherche d'emploi.

Des espaces de coworking sont

proposés dans toute la France.
Tout savoir sur les
contrats d'alternance
Une question ? Un projet ?
Contacter : job.placement@openclassrooms.com
Contrat de
professionnalisation
1 jour en formation / 4 jours en entreprise.

L'entreprise embauche l'étudiant en CDD sur 12 ou 24 mois (selon le parcours de

formation).
La formation est financée par un OPCO. OpenClassrooms est référencé dans les
principaux OPCO grâce à ses titres certifiés et sa certification Datadock.
L'entreprise fait la démarche de demande de prise en charge auprès de son OPCO.
Nos équipes sont présentes à chaque étape pour l'accompagner.
L'étudiant est rémunéré sur une base qui va de 65% à 100% du SMIC (pour un
étudiant de plus de 26 ans).
Si l’étudiant a plus de 26 ans et est demandeur d’emploi, Pôle Emploi octroie une
aide à l’emploi à l’entreprise.

Contrat
d'apprentissage
2 jours en formation / 3 jours en entreprise.

L'étudiant est embauché sur 12 ou 24 mois selon sa formation.

Le contrat d’apprentissage concerne les personnes de 16 à 29 ans révolus (sans limite
d’âge pour les publics RQTH, mais aussi les créateurs d’entreprise, les sportifs de haut
niveau et l’encadrement de haut niveau).
Le contrat d’apprentissage peut être signé par les employeurs dans le secteur public
et les entreprises privées.
La formation est 100% financée grâce à la taxe d’apprentissage pour les
entreprises du secteur privé. Pour le secteur public, une convention financière est
établie entre OpenClassrooms et l’employeur.
Une rémunération de l’apprenti est prévue : jusqu’à 100% du SMIC en fonction de son
âge et de l’année de sa formation.
Notre CFA vous accompagne dans toutes les démarches administratives concernant
la mise en place de contrat d’apprentissage.