Home>
Courses>

Using the Python Transcrypt Transpiler for Front-end Coding

Using the Python Transcrypt Transpiler for Front-end Coding

Delve into using Transcrypt to seamlessly translate Python code to JavaScript for coherent web projects, unifying Python's back-end strengths with JavaScript's front-end flexibility.

Beginner

124 Lessons

11h

Certificate of Completion

Delve into using Transcrypt to seamlessly translate Python code to JavaScript for coherent web projects, unifying Python's back-end strengths with JavaScript's front-end flexibility.

AI-POWERED

Explanations

AI-POWERED

Explanations

This course includes

74 Playgrounds
24 Quizzes

This course includes

74 Playgrounds
24 Quizzes
Course Overview
What You'll Learn
Course Content

Course Overview

Python is already used in the back-end of most web-based applications. However, it does not work with the front-end of web browsers in those applications. This is where Transcrypt comes in. Transcrypt can help create more coherent web-based projects where Python is used to write the back-end and front-end. This course is primarily about using a transpiler called Transcrypt. It translates our Python code to JavaScript and then executes that JavaScript, letting us enjoy the neatness of Python with the front-e...Show More

What You'll Learn

Learn how to use the basics of Transcrypt.

Learn the basics of React.

Learn how to use React in Python with Transcrypt.

Learn to develop a front-end in Python and React.

What You'll Learn

Learn how to use the basics of Transcrypt.

Show more

Course Content

1.

Introduction

Discover how to use Transcrypt to translate Python code into responsive front-end applications.
Course Overview
Who Is This Course For?
2.

The Setup

Get started with integrating Python in front-end development using Transcrypt and React.
Full-stack Python
Transcrypt
React
npm and Parcel
Quiz on the Transcrypt Setup
Summary
3.

Write a “Hello, World” Application

Go hands-on with setting up Transcrypt, creating a "Hello, World!" app, and coding challenges.
A Few Things to Note
Hello, World!
Coding Challenge
Quiz on Our “Hello, World” Application
Summary
4.

JavaScript Functions

Grasp the fundamentals of integrating Python and JavaScript functions using Transcrypt.
Random Numbers
Coding Challenge
Quiz on JavaScript Functions
Summary
5.

Sourcemaps

Trace Python code errors in the browser for efficient debugging with Transcrypt sourcemaps.
Debugging Console
Quiz on Transcrypt’s Sourcemaps
Summary
6.

External JavaScript Libraries

4 Lessons

See how it works to integrate external JavaScript libraries and handle input with Transcrypt.
7.

Intro to React

5 Lessons

Approach foundational React concepts, React state management, and hands-on coding challenges.
8.

React Concepts

6 Lessons

Sharpen your skills in React's DOM manipulation, component structures, and unidirectional data flow.
9.

Cleaner Code

4 Lessons

Grasp the fundamentals of enhancing Python for React, improving code organization, and handling events.
10.

Managing JavaScript Packages

4 Lessons

Master the steps to manage JavaScript packages and integrate local libraries in Python.
11.

Package Bundler

5 Lessons

Grasp the fundamentals of using Parcel for streamlined Python web application development.
12.

Text Input

5 Lessons

Take a closer look at managing state and handling user inputs in React with Transcrypt.
13.

Lists

5 Lessons

Tackle dynamic list management, React component structuring, and list comprehensions in Python Transcrypt.
14.

Forms

3 Lessons

Form transitions improve data handling and structure in your React application.
15.

React Components

7 Lessons

Learn how to use Python in React to create and manage front-end components effectively.
16.

JavaScript Examples

9 Lessons

Unpack the core of converting JavaScript React components to Python using Transcrypt.
17.

CSS

7 Lessons

Work your way through integrating CSS in React using stylesheets, inline styles, and frameworks.
18.

Material-UI

6 Lessons

Break down complex ideas with Material-UI's theming, styling, and practical coding challenges.
19.

Parcel Web Proxy

5 Lessons

Integrate Flask and Parcel with a proxy server to streamline front-end and back-end communication.
20.

Asynchronous Requests

5 Lessons

Simplify complex topics of asynchronous operations in Python and JavaScript for seamless UI updates.
21.

React Context Hook

5 Lessons

Piece together the parts of managing React state, props, and contexts in nested components.
22.

Transcrypt Miscellany

5 Lessons

Learn how to use Transcrypt for Python-to-JavaScript web development with built-in functions, immutability, and type handling.
23.

Application Versioning

4 Lessons

Discover the logic behind efficient application versioning with npm and Git integration.
24.

Google Analytics

4 Lessons

Master the steps to integrate Google Analytics with ReactGA for performance monitoring.
25.

Developer Tools

4 Lessons

Apply your skills to enhance efficiency with essential Python React development tools.
26.

Appendix

2 Lessons

Map out the steps for setting up and executing Python environments using Transcrypt.

Course Author

Trusted by 1.4 million developers working at companies

Anthony Walker

@_webarchitect_

Evan Dunbar

ML Engineer

Carlos Matias La Borde

Software Developer

Souvik Kundu

Front-end Developer

Vinay Krishnaiah

Software Developer

Eric Downs

Musician/Entrepeneur

Kenan Eyvazov

DevOps Engineer

Souvik Kundu

Front-end Developer

Eric Downs

Musician/Entrepeneur

Anthony Walker

@_webarchitect_

Evan Dunbar

ML Engineer

Hands-on Learning Powered by AI

See how Educative uses AI to make your learning more immersive than ever before.

Instant Code Feedback

Evaluate and debug your code with the click of a button. Get real-time feedback on test cases, including time and space complexity of your solutions.

AI-Powered Mock Interviews

Adaptive Learning

Explain with AI

AI Code Mentor

FOR TEAMS

Interested in this course for your business or team?

Unlock this course (and 1,000+ more) for your entire org with DevPath