Giter VIP home page Giter VIP logo

10x-react-engineer's Introduction

10x-React-Engineer

Coding was livestreamed here -> https://youtube.com/live/6_sdnYDmUmo

How it works

10x-React-Engineer first uses the GPT-Engineer method of taking in the users input and scaffolding the project first starting at the entry point and resolving all the imports recursively (through the prompting).

Then there's a dev loop that will first resolve missing dependencies it missed from reading the codebase. Then the loop will ask the user for additonal modifications to make to the react components (like updating the design to bootstrap)

  1. User ask summarization
  2. Scaffolding
  3. Dev Loop
    • Dependency fixer
    • Code modification feedback

The AI asks your initial prompt and requests modifications in a feedback loop

Screen Shot 2023-08-15 at 2 22 06 AM

Example generated output

Screen Shot 2023-08-15 at 2 26 35 AM

After each loop it will write the code in the react-output directory

The User ask summarization will eventually be optional as I keep working on the features. I found it to be more so how things work in the real world.

How to use it

So far I have the main.py and a jupiter notebook with all the code accessible in the end it outputs into a react-output folder

This next upcoming week I will revamp the codebase into more than a single file and add more features. I want to keep iterating on this until it's working well enough to generate React projects locally on a finetuned 7b llama 2 model.

Here's a Google Colab with the code for you to play with

This is an experiment

This was coded in 6 hours on a live stream I did Aug 14th 2023. Have mostly been avoiding autonomous agents until the dust settled but a viewer on my discord suggested I just go for it so here it is. This actually impressed me a lot. Llama 2's reasoning ability with just the 13b parameter model was very impressive. There are still inconsistent issues which you can see near the end of the live stream with resolving webpack.config.js pathnames. However you can update the prompts or use a larger model to try and straighten those out.

It actually works pretty well for only being tested on Llama 2 13b Chat model. Going to push the limits more with the 70b model and show results.

TODO

  • Main thing is to fine tune the 13b chat llama 2 to be better at react
  • JSON fixer for package.json post processing
  • Add generated codebase as context to modification inferences
  • Add option to modify everything vs file by file
  • Make ask summarization optional

10x-react-engineer's People

Contributors

jawerty avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.