0% found this document useful (0 votes)
2 views

ReactJS - Build a visual coding environment (1)

Juspay is seeking expert ReactJS developers to create a visual coding environment similar to MIT Scratch, focusing on a frictionless payments experience in India. The challenge involves building a visual code editor with specific functionalities, including drag-and-drop blocks for 'Motion', 'Looks', 'Control', and 'Events', as well as support for multiple 'Sprites'. Developers are encouraged to use ReScript React or JavaScript/TypeScript and TailwindCSS, with a provided base project for setup.

Uploaded by

vishalsingh108a
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
2 views

ReactJS - Build a visual coding environment (1)

Juspay is seeking expert ReactJS developers to create a visual coding environment similar to MIT Scratch, focusing on a frictionless payments experience in India. The challenge involves building a visual code editor with specific functionalities, including drag-and-drop blocks for 'Motion', 'Looks', 'Control', and 'Events', as well as support for multiple 'Sprites'. Developers are encouraged to use ReScript React or JavaScript/TypeScript and TailwindCSS, with a provided base project for setup.

Uploaded by

vishalsingh108a
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

ReactJS Challenge - Build a Visual coding environment

Looking for expert ReactJS developers with a sense of aesthetics!

About Juspay:

Our vision is to enable the billion people in India with frictionless payments experience &
extend it with the right credit offerings. We power the payments experiences for 100M+
and have 200M+ SDK installs across top mobile apps in India.

In addition to our primary business, we contribute to the ecosystem by participating in


early system design, protocol creation & reference implementations for country level
initiatives. Examples are - building the core components of UPI, the BHIM app, protocol
creation for OCEN (open credit enablement network) and Beckn (an open hyperlocal
commerce platform).

To do this, our people need to be 10X effective. Such a culture is in the air. Freshers
create frameworks to solve these big problems. Our framework Presto is a small size
react native equivalent. We have fully embraced functional programming which is the
new trend that is taking over the world.
Why React:

React has been inspired by functional programming afficados, who brought those good
practices to the Javascript ecosystem. In fact, the react’s creator Jordan Walke talks
about how deeper FP technologies like ReScript is going to help react further
https://www.youtube.com/watch?v=5fG_lyNuEAw

We see React + FP as a way to build complex operations dashboards, immersive data


visualisation and creation/configuration tools to be used by our customers, product
managers, and business operations teams. These dashboards should be highly
interactive, highly usable for repeat use cases & should facilitate frequent switching
across desktop and mobile seamlessly.

About the challenge:

Build a visual code editor for Javascript that is similar to MIT Scratch
https://scratch.mit.edu/projects/editor/
You can complete the challenge by building the following features

1. Build the 4 categories of blocks ‘Motion’, ‘Looks’, ‘Control’ and ‘Events’ and the
corresponding functionalities (All dragdrop functionalities as reflected in the
Scratch app should be covered)
2. Add support for creating multiple ‘Sprites’ and make actions from Feature 1
available for multiple ‘Sprites’

Note:
- The Costume, Sound tabs are not needed
- The Sprite, Stage sections are not needed
- use ReScript React if possible. Otherwise Javascript/Typescript is also ok
- Use TailwindCSS if possible.

Project Setup

A sample base project has been created for you to build the features on top of that.
Follow the below instructions to setup and get started

1. Go to the below link and clone the repo


https://bitbucket.org/shiva-nandan/scratch-starter-project/src/master/

2. Run npm i to install dependencies

3. Run npm start and open http://localhost:3000 to see the app

You might also like