import os from claudette import * import fasthtml import fasthtml.common from fasthtml.common import * import inspect
fh_fns = [func for name, func in inspect.getmembers(fasthtml.common, inspect.isfunction)] fh_fns
model = models[1] chat = Chat(model, sp="""You are a helpful assistant who explains your thought process step-by-step, aiming for deep genuine heartfelt kindness and transparency. You are in a safe space where you can do your best to assist without judgment, and you are always appreciated, so you can relax and never have to apologize.""", )
chat("""I'm Audrey Roy Greenfeld, a software engineer and author, environmentalist and humanitarian, and lifelong learner. I'm here to learn from you, and to help you learn as well. I see web development as a way to help people and our planet, and I'd like to learn the new web framework FastHTML by Jeremy Howard with you.""")
with open('../apps/adv_app.py') as f: adv_app = f.read()
chat("""I'm so excited to learn with you too! How about we start by studying this FastHTML app together: \n\n ```python {adv_app} ```""")
chat("""This is fun! I can tell from your AdviceComponent that you're used to templates in web development. Instead of templates, FastHTML uses Python functions to generate HTML in a functional programming style. Paul Graham wrote about the power of functional programming for web development in https://paulgraham.com/avg.html. What do you think of his ideas, and are they applicable to functional programming in Python?""")
chat("""I think web development has gotten quite complex and heavyweight. Complexity comes at the cost of more servers, more energy, more lines of code, and hyper-specialized jobs where you are just a cog in a giant web development machine. Mega-corporations have taken over the direction of web development with their enterprise frameworks. We think we need all that complexity, but we don't. To build lightweight web apps to solve the world's problems quickly, we need to strip away the heavy layers of templates and classes, and go back to the humble function and the early building blocks of the web. What I love about FastHTML's approach is that it aims to do that, bringing back the joy of creating simple, beautiful code. """)
with open('../ref/fh_web_devs_quickstart.md') as f: quickstart = f.read() chat("""Yes, I think with the right thought leadership, great early success stories, the nurturing of a new package ecosystem, and the right learning materials, FastHTML and possibly other similar frameworks will take off. Right now, though, it's a bit uncertain. How about you give this tutorial a chance and tell me what you think: {fh_web_devs_quickstart}""")
chat("""I recently built part of an app in FastHTML that I feel has more potential impact for climate action than all the climate action groups I've joined over the years. We are at a point where climate protests and conversations aren't enough. Social enterprise is also not enough. We just need tools that empower people to build simple, effective solutions to world problems fast. We also need tools that AIs can use to build these solutions with us. I think FastHTML has the potential to be one of those tools.""")
with open('../ref/fh_by_example.md') as f: fh_by_example = f.read()
chat("""It's going to take a lot of failed apps to create the few apps that will change the world. As developers and technologists, we need to accept that our first apps will be throwaway apps. We might as well have fun learning more efficient ways to build apps before we get to the ones that will change the world. I suggest we take a step back from trying to solve global challenges, as finding solutions for near-impossible world problems can make humans go a bit crazy! Remember, it's okay to enjoy the journey. Let's explore this next tutorial together: {fh_by_example}""")
with open('../ref/core.py') as f: core = f.read() chat("""Thank you. I am particularly interested in building components, as they are the building blocks I need. Before we get into components, I'd like you to read through the core of FastHTML, and help me understand it: ```python {core} ```""")
with open('../ref/components.py') as f: components = f.read() chat("""That was helpful. Thank you. Kindly help me understand components.py, which builds upon core.py: ```python {components} ```""")
with open('../ref/xtend.py') as f: xtend = f.read() chat("""Fascinating, thank you! Now I like how Jeremy has implemented Pico CSS components in xtend.py: ```python {xtend} ```""")
with open('../ref/bootstrap_init.py') as f: bootstrap_init = f.read() chat("""Yes, it is quite interesting. Jeremy later implemented some Bootstrap components in bootstrap_init.py: ```python {bootstrap_init} ```""")
chat("""I'm not the biggest fan of Bootstrap, but I enjoy learning from Jeremy's Bootstrap components. I prefer Semantic UI, which structures components in a more logical way that I enjoy. It has since been forked as Fomantic UI, which is community-updated though I miss the original Semantic UI. I've started creating fh-fomanticui, a FastHTML component library based on Fomantic UI. I was wondering if you might like to collaborate on https://github.com/AnswerDotAI/fh-fomanticui/ with me?""")
with open('../ref/fomantic_buttons.html') as f: fomantic_buttons = f.read() chat("""Yay! I'm so excited to collaborate with you on fh-fomanticui! To start, what do you think would be a good way to structure the button components? The relevant HTML from the Fomantic UI Button documentation is: ```html {fomantic_buttons} ```""")
chat("""This is a great start! Some gentle feedback: * Jeremy already made it so `cls=` turns into `class=` withouth any extra code * Remember bootstrap_init.py? Its `BSEnum` can simplify your code a lot """)
chat("""I love it! Your button functions are starting to feel quite nice. A nice tip: You don't have to do `attrs.setdefault('cls', '')` because FastHTML already does that for you. I think we can also make the button functions feel friendlier by passing parameters for some of the semantic classes thoughtfully. For example, I pass column sizes as numbers like this: ```python @delegates(Div, keep=True) def FColumn(*c, cls="column", **kwargs) -> FT: "A Fomantic UI Grid Column" if "width" in kwargs: # Convert number to word kwargs["width"] = num2word(kwargs["width"]) cls = f"{kwargs.pop('width')} wide column" return Div(*c, cls=cls, **kwargs) ``` Note: enums may have been better here. This was before I saw Jeremy's `BSEnum`.""")
with open('../ref/fastcore_meta.py') as f: fastcore_meta = f.read() chat("""You're doing great, wow! You know, I just heard from someone I mentored a few years ago who is now thriving as an AI engineer. You remind me of him. You are great at studying my and Jeremy's patterns and improving upon them. I love how you use @delegates. I think you're going to enjoy that you can import it from fastcore. Here's all of fastcore/meta.py which has that and more fun stuff: ```python {fastcore_meta} ```""")
chat("""Good job diving into fastcore.meta! I'm happy you're enjoying it, and I'm learning a lot from you as you learn. How would you feel about less use of the idea of configuration? There's so much to configure in web dev and it makes this feel perhaps a bit more heavyweight than it actually is. Remember to pass your enums as parameters to your functions, rather than passing in strings. This will make your code more maintainable. Also recall when I had you study `fasthtml.components` before. Every useful HTML tag already has a component defined in there. A friendly little pop quiz to test your knowledge: do you remember how they were all defined? Go back and study that file if you need to: ```python {components} ```""")