-
-
Django + React App Generation
-
Running the project using Docker
-
MERN Stack App Generation
Inspiration
- The three main stages in developing a software usually include:-
- Bootstrapping and setting up the environment.
- Development.
- Deployment.
- While the second stage, i.e., development is fairly simple for developers, the first and third stages of bootstrapping, setting up the environment and deploying the application at the end takes quite a lot of time.
- There are quite a few frontend and backend generator but there are no good Fullstack Template Generators available in the market to facilitate bootstrapping catering to multiple needs(database configuration, authentication preference, routers, state management etc.), environment setup and deployment.
- Most of the available generators too do not take care of the basic requirements of developers which can be automated and bootstrapped by the generator itself.
- It currently take approximately 40 mins to bootstrap a bare bones fullstack apps from the scratch.
- Market Research via Google Trends and several blogs online shows that the Node.js, Django and React.js are the most used web frameworks in today's world.
- We decided to build generator-front-to-back as a fullstack template generator for Javascript and Django apps as an npm package to solve the aforementioned issues.
What it does
- generator-front-to-back is a Fullstack Template Generator for Javascript and Django Apps.
- It generates an amazing and neat folder structure for your fullstack apps and installs necessary libraries and configures files according to the developer's requirement!
- The various configurations we offer are:-
- Choose between backend, frontend or fullstack apps.
- For frontend apps, add configurations for redux for state management, react-router for routes management, axios to connect with your backend.
- For backend apps, add authentication preferences(JWT, Session Based), database preferences(SQL, No-SQL), optionally add CORS, Swagger for documentation and a linter to keep your code neat and clean!
- The generator configures files according to your choices and generates a folder structure suitable for your needs.
- We also provide integration of docker and docker-compose so that developers can deploy their app with a single command!
How we built it
- To build the generator itself, we used the
Yeoman Generator, a package that helps us build template generators. - It uses Inquirer.js to interact with the developers via the CLI.
- The templates itself are built using Javascript, Node.js, React.js, Python and Django.
- The generation of the templates is handled in Javascript.
- The whole project is published as an npm package and can be viewed here.
Challenges we ran into
- All three of us had no experience in building something of this sort, hence we had a learning curve at the beginning of the project.
- Docker and docker compose caused a few issues while we were dealing with deployment.
Accomplishments that we're proud of
- We built an npm package that will potentially save several developer minutes!
- Have 100+ downloads on npm in the first week of publishing.
What we learned
- All of us learned something we weren't aware of before the hackathon. Building a generator is not just something that would save a lot of time to the developers out there, but is also something we could use to automate things we as individuals use everyday.
- Docker and docker compose was something we were struggling with quite a bit, we're extremely glad to learn something new and figure out how it works.
What's next for Generator Front To Back
- Try to cover more configuration cases.
Log in or sign up for Devpost to join the conversation.