Structure a Flask React Monorepo

📰 Dev.to · Warren Wong

Learn how to structure a Flask React monorepo for efficient development and collaboration

intermediate Published 8 Jun 2019

Action Steps

Create a new Git repository for your project
Initialize a Flask server in a subdirectory named 'server' using 'flask init'
Create a new React app in a subdirectory named 'client' using 'create-react-app'
Configure the Flask server to serve the React app by setting the 'STATIC_FOLDER' and 'TEMPLATE_FOLDER' variables
Use a tool like Docker or Docker Compose to containerize and manage your application's dependencies and environment

Who Needs to Know This

This tutorial is beneficial for full-stack developers, software engineers, and DevOps teams working on projects that involve both Flask and React, as it provides a clear structure for organizing code and streamlining workflows.

Key Insight

💡 A well-structured monorepo can simplify development, testing, and deployment of full-stack applications

Key Takeaways

Learn how to structure a Flask React monorepo for efficient development and collaboration

Full Article

Title: Structure a Flask React Monorepo

URL Source: https://dev.to/wrrnwng/structure-a-flask-react-monorepo-1eb9

Published Time: 2019-06-08T17:58:48Z

Markdown Content:
[Skip to content](https://dev.to/wrrnwng/structure-a-flask-react-monorepo-1eb9#main-content)

[![Image 1: DEV Community](https://media2.dev.to/dynamic/image/quality=100/https://dev-to-uploads.s3.amazonaws.com/uploads/logos/resized_logo_UQww2soKuUsjaOGNB38o.png)](https://dev.to/)

[Powered by Algolia](https://www.algolia.com/developers/?utm_source=devto&utm_medium=referral)

[Log in](https://dev.to/enter?signup_subforem=1)[Create account](https://dev.to/enter?signup_subforem=1&state=new-user)

## DEV Community

![Image 2](https://assets.dev.to/assets/heart-plus-active-9ea3b22f2bc311281db911d416166c5f430636e76b15cd5df6b3b841d830eefa.svg)8 Add reaction

![Image 3](https://assets.dev.to/assets/sparkle-heart-5f9bee3767e18deb1bb725290cb151c25234768a0e9a2bd39370c382d02920cf.svg)7 Like ![Image 4](https://assets.dev.to/assets/multi-unicorn-b44d6f8c23cdd00964192bedc38af3e82463978aa611b4365bd33a0f1f4f3e97.svg)1 Unicorn ![Image 5](https://assets.dev.to/assets/exploding-head-daceb38d627e6ae9b730f36a1e390fca556a4289d5a41abb2c35068ad3e2c4b5.svg)0 Exploding Head ![Image 6](https://assets.dev.to/assets/raised-hands-74b2099fd66a39f2d7eed9305ee0f4553df0eb7b4f11b01b6b1b499973048fe5.svg)0 Raised Hands ![Image 7](https://assets.dev.to/assets/fire-f60e7a582391810302117f987b22a8ef04a2fe0df7e3258a5f49332df1cec71e.svg)0 Fire

0 Jump to Comments 3 Save Boost

Copy link

Copied to Clipboard

[Share to X](https://twitter.com/intent/tweet?text=%22Structure%20a%20Flask%20React%20Monorepo%22%20by%20%40wrrnwng%20%23DEVCommunity%20https%3A%2F%2Fdev.to%2Fwrrnwng%2Fstructure-a-flask-react-monorepo-1eb9)[Share to LinkedIn](https://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Fdev.to%2Fwrrnwng%2Fstructure-a-flask-react-monorepo-1eb9&title=Structure%20a%20Flask%20React%20Monorepo&summary=This%20is%20my%20project%20structure%20for%20a%20Flask%20server%20and%20React%20client%20residing%20in%20the%20same%20git%20repository....&source=DEV%20Community)[Share to Facebook](https://www.facebook.com/sharer.php?u=https%3A%2F%2Fdev.to%2Fwrrnwng%2Fstructure-a-flask-react-monorepo-1eb9)[Share to Mastodon](https://s2f.kytta.dev/?text=https%3A%2F%2Fdev.to%2Fwrrnwng%2Fstructure-a-flask-react-monorepo-1eb9)

[Share Post via...](https://dev.to/wrrnwng/structure-a-flask-react-monorepo-1eb9#)[Report Abuse](https://dev.to/report-abuse)

[![Image 8: Cover image for Structure a Flask React Monorepo](https://media2.dev.to/dynamic/image/width=1000,height=420,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fwarrenwong.org%2Fstatic%2Febbcb1d8d9588fbcccc93f9620bba320%2F96726%2Fashim-d-silva-106275-unsplash.jpg)](https://media2.dev.to/dynamic/image/width=1000,height=420,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fwarrenwong.org%2Fstatic%2Febbcb1d8d9588fbcccc93f9620bba320%2F96726%2Fashim-d-silva-106275-unsplash.jpg)

[![Image 9: Warren Wong](https://media2.dev.to/dynamic/image/width=50,height=50,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F104643%2Fdffb20fc-6f54-4d3e-81f3-ae63dc820808.jpeg)](https://dev.to/wrrnwng)

[Warren Wong](https://dev.to/wrrnwng)
Posted on Jun 8, 2019 • Originally published at [warrenwong.org](https://warrenwong.org/structure-a-flask-react-monorepo/) on Jun 8, 2019

![Image 10](https://assets.dev.to/assets/sparkle-heart-5f9bee3767e18deb1bb725290cb151c25234768a0e9a2bd39370c382d02920cf.svg)7![Image 11](https://assets.dev.to/assets/multi-unicorn-b44d6f8c23cdd00964192bedc38af3e82463978aa611b4365bd33a0f1f4f3e97.svg)1![Image 12](https://assets.dev.to/assets/exploding-head-daceb38d627e6ae9b730f36a1e390fca556a4289d5a41abb2c35068ad3e2c4b5.svg)![Image 13](https://assets.dev.to/assets/raised-hands-74b2099fd66a39f2d7eed9305ee0f4553df0eb7b4f11b01b6b1b499973048fe5.svg)![Image 14](https://assets.dev.to/assets/fire-f60

Read full article → ☆ Save to playlist ← Back to Reads

Structure a Flask React Monorepo

Key Takeaways

Full Article

Related Videos