You Can Build an App With ChatGPT in 60 Minutes

TL;DR: Today we’re releasing a new episode of our podcast How Do You Use ChatGPT? I go in depth with Geoffrey Litt, a researcher at the lab Ink & Switch, on the future of software and AI. As we talk, we build our own app together in 60 minutes using ChatGPT and Replit. Watch on X or YouTube, or listen on Spotify or Apple Podcasts.

Geoffrey Litt wants you to build software—whoever you are. Not just if you’re a seasoned software engineer in San Francisco, but even if you have minimal—or zero—coding knowledge. 

He’s a researcher who’s working on creating a future where anyone can make changes to the software they use—what he calls malleable software. I’ve been writing about similar topics—like how AI might turn everyone into a developer and upend SaaS business models—for a while, and it was great to have Geoffrey on the show to discuss our overlapping ideas.

We talked about how ChatGPT enables anyone to build single-use apps and expands the horizon of who gets to build things. We even put our money where our mouth is: As we talked, we built an app together in ChatGPT and Replit.

It was some of the most fun I’ve ever had recording a podcast episode, and if you’re interested at all in the future of software and AI, it’s a must-watch.

Here’s a taste of what we talk about. 

• Coding is getting easier—and much faster. ChatGPT has the potential to make coding possible for novice coders and make coding drastically easier—or more efficient—for seasoned pros. “A lot of the time it's actually faster now for me to just make the thing that has the tiny features that I need than to go try to Google which one is the best and learn how to use it,” Geoffrey says.
• ChatGPT as a muse, not an oracle. Geoffrey wants people to treat ChatGPT like an in-house consultant: “It's like a designer or or an engineer—the earlier you bring them in, the more they can contribute to the ideas and the more context they build up.”
• The benefits of a coding plan. Big projects necessitate ample planning. “If I'm going to spend six months on a huge project, I better have a plan when I start,” Geoffrey says. That’s true for ChatGPT, too. Providing a plan helps clue the chatbot into your ambitions.
• Don’t waste time reading the code. Geoffrey says if you’re working off ChatGPT code, just run it and see what happens. Don’t bother poring over the code until you know if it works or not. “It's a waste of time,” he says. “I would rather just see what it did and use the thing.”
• The future is “modding and mixing.” If software isn’t doing what you need, the answer currently is usually to start from scratch. “Often what I actually would prefer is to start with an app that someone else made that's almost right, but I just need to make a small tweak,” Geoffrey says. With malleable software, he says tinkering could become the new normal.
• “Effortless flow.” Building an app together was easy and fun. That’s what we both want coding experiences to be like. “LLM-based tools are sort of on a path to enabling that for way more people in way more situations,” Geoffrey says.

You can check out the episode on Twitter/X, Spotify, Apple Podcasts, or YouTube. Links and timestamps are below:

• Watch on X
• Watch on YouTube
• Listen on Spotify (make sure to follow to help us rank!)
• Listen on Apple Podcasts

Timestamps:

1. Intro 1:03
2. What is malleable software? 1:36
3. Who gets to make software on the web 8:06
4. Deciding what app to build. 14:50
5. Starting on our app. 22:06
6. Don’t read the code first. 31:07
7. Starting from scratch could soon be a thing of the past. 47:55
8. Getting past those final error messages 55:50 
9. Voila! An app. 1:03:31
10. Effortless flow. 1:05:50

What do you use ChatGPT for? Have you found any interesting or surprising use cases? We want to hear from you—and we might even interview you. Reply here to talk to me!

Miss an episode? Catch up on my recent conversations with Waymark founder Nathan Labenz,  Notion engineer Linus Lee, writer Nat Eliason, and Gumroad CEO Sahil Lavingia and learn how they use ChatGPT.

Transcript

Dan Shipper (00:00:01)

Why don’t we build something together?

Geoffrey Litt (00:00:02)

Alright. Let’s see how it goes. So I'm going to kick us off with my goal, which is, “I'm appearing as a guest on a podcast. I want an app that I can have open while I'm on the show to help me keep track of time and remember what I want to say.” Okay. So we got this code. I'm not going to read it. I just copy, paste and go. I'm just pasting from ChatGPT. This should update live, this little window here. 

So it has the time, did the simple dark theme pretty well. I would say it has a box for notes.

Dan Shipper (00:00:33)

This is magic. Like this is crazy.

[Intro sequence]

Dan Shipper (00:00:47)

Geoffrey, welcome to the show. 

Geoffrey Litt (00:00:48)

Thanks so much. It's good to be back. 

Dan Shipper (00:00:50)

Yeah. Good to have you. I interviewed you, I think two or three years ago on Superorganizers. That interview went really, really well. And, I just think you're one of the deepest thinkers about this stuff. And in the pre-production call, I was just saying like, I think generative AI just sort of, it just takes the things that you've been thinking about to a new level. And I'm just really excited to check in with you. 

Geoffrey Litt (00:01:12)

Yes, a lot has changed over the past couple of years.

Dan Shipper (00:01:17)

And for folks that are not familiar with your work, you are a researcher at Ink & Switch, which is an independent research lab, and you explore what you call malleable software, which are computing environments where anyone can mold their own tools to their needs. Can you talk to us about what malleable software is and why that's important? 

Geoffrey Litt (00:01:36)

Yeah, absolutely. So this has been a quest that I've been on for at least the last five years now. And it all started, I was working at a startup and we were making SaaS software for schools. And, I just started getting really bummed that we kept saying no to every single request that came our way from some teacher in a classroom.

And they would say, “ can, can you change this word because it doesn't match the way I teach?” Or, “Can you add this little button for me that would do X?” And we would say, “No, we,we’re not going to add that button just for you.” And that's such a normal way of thinking about software for, for people used to SaaS.

Bbut it felt really strange to me. And so I started wondering what if we had a world where everybody could craft software tools that match the workflows they want to have, unique to themselves and not just using these, pre-made tools. That’s what malleable software means to me is that we can all have the software that works for us, not for some product manager off in San Francisco.

And the really interesting thing that's happened the past couple of years is that, until recently programming was a huge bottleneck in this space. You need to do a lot of programming to make any sort of software. And the big question was how can we sort of route around programming to give people tools to make software without doing that?

And what really excites me about generative AI is that, oh my gosh, we now have a thing that can kind of, sometimes turn fuzzy ideas into code. And so that's starting to cut almost like a shortcut through that impassable mountain. And I think it's a really exciting time to be exploring how can we apply that base technology to help everybody make and edit the software that they want to have.

Dan Shipper (00:03:15)

Right. I love that. It's an idea I've been thinking about as well. You're obviously far deeper than I am, but I wrote this article called “What comes after SaaS?” I don't know, probably six months ago. And, the short answer is bespoke apps customized by AI. And, I think for people who are sort of newer to this one, one way to think about it, and I'm curious what you think of this metaphor is like the difference between right now, a lot of the software that you use, it's sort of like…when you use Spotify or Gmail or whatever, it's sort of like staying at a hotel where veryone gets the same hotel room. Andthe company is running the hotel and when you sign up for Gmail or whatever, you get your little Gmail hotel room and it's got all the same things as everybody else.

And there's like some ways that you can customize it. Like obviously you put your luggage in the hotel room, like, so there's certain things that are yours. But. Everything is basically the same, the same basic model, and over time, companies get, especially SaaS companies get good at adding little customizations or whatever, but it's always on their terms.

It's always on their guardrails. And I think your vision of software is a little bit less like these infinitely large hotel rooms that people are staying in and more like everyone owning their own home or something like that. And, either having power tools and the ability to use them, or maybe having their own general contractor on staff that they can, they can deploy to make any change they want.

Geoffrey Litt (00:04:47)

Yeah. I love that analogy. I think it's a really good one too, because it's subtle in that sometimes hotels are fine. And there's a whole spectrum from renting a hotel room to renting an apartment to buying a house that someone else built. There are people also who build their own home from scratch and design it all right. And there's a whole spectrum there and it's okay to, I think at different times be on different points. What I think is really pernicious about the hotel idea though is like, imagine we all lived in hotel rooms all the time. you would probably stop thinking about questions like, “Oh, what would be a better layout?” When I walk into a hotel room, I don't start thinking about moving the walls around or changing the decorations because it's not a thing that I obviously am allowed to do. And so, those questions don't occur to me. And that's what I worry about with software, the worst case outcome is that we all use SaaS tools that subtly affect the way we think. And we don't even realize it because we're just so used to living in those tools.

Dan Shipper (00:05:43)

Yeah. I was just talking to a couple of weeks ago—I was talking to Linus Lee on this show, and he was talking about something similar, which is, the idea of agency and how our tools shape the agency that we have, and, and thinking about ways to give users more agency in the context of general AI, where I think, in large part for now, there's maybe a little bit less agency in something like using Midjourney than you might get in something like using Photoshop because you can like literally, with Midjourney, you can prompt it, but in Photoshop, you can literally change the pixels and, so figuring out ways to give people finer-grained control, it's a really interesting challenge in generative AI. 

Geoffrey Litt (00:06:26)

Yeah, absolutely, and I think one really important point here is that there's a lot of different dimensions of how people gain agency.

And some of them are things surrounding the AI and are not core to the AI itself. So one, one, example following on with the hotel analogy, right. As you said,maybe everybody has a general contracting team that they can bring to their hotel room. If you show up at a hotel with a construction crew, they're not going to let you tear down your room and rebuild it. There's like a sort of social agreement or legal framework or whatever around, your contract with that entity, where it's not really like your ability to move walls physically, that is the constraint. And so, to bring that back to software, what I think about a lot is, if I had a personal team of 100 developers that were working for me, what could I do with that power and, let's say I'm using Spotify and I'm like, “Oh, I hate the way that Spotify shows me these playlists. I wish that it showed me that in a different way.” I can’t edit the Spotify app. I don't have control over that and so, what I'm thinking about a lot these days is how can we reorient the way software is distributed and constructed so that my, so to speak, personal dev team can actually do useful stuff for me.

And, for example, maybe they could make browser extensions for me, or maybe they could, if my software is open source and I control it, maybe they could start adding features for me. How can we change the foundations of software in a way that is best positioned to take advantage of the fact that everybody is going to have this power available to them in the coming years?

Dan Shipper (00:08:06)

Yeah. No, that makes total sense. And it's just making me think of … I teach this course called “How to build an AI chatbot” and one of the really incredible things about this course is we take people from not really being able to code to shipping an app in 30 days. And, it's really cool because I feel like there are all these people out there who are just waking up to the idea that they have these magical powers where they can literally now build stuff in a way that they couldn't before.

And a lot of these people are like, okay, it's a product manager who you work with engineers and you've maybe you took one coding class in college, but you've never felt confident enough to actually go build and ship a React app or whatever. And what all they really need is like a little push to be like, okay, just use ChatGPT, ask it what to do. Here's some sample code and like go. And it really changes things for people where on day one, they can have a working chatbot with a couple prompts and that's like a big, “holy shit, I cannot believe that I can actually make something.” And then what it does is it motivates them to try to learn the underlying fundamentals in this way that's like very connected to practice, as opposed to the way that you used to have to learn programming, which is like, you spend six months like learning about loops and if statements and like all this stuff, and you're like, “I have no idea how this connects to like the things I want to make.”

And so I just think that there's this really, quickly expanding horizon of who gets to make things in the world and there are a lot of people who are within the horizon of being able to make stuff that don't know it yet, but all they literally have to do is sit down with ChatGPT. And that horizon is going to be significantly larger in five years. And I think that's one of the things that you're working on. And I think it's so exciting. 

Geoffrey Litt (00:10:05)

I love that way of thinking about it. For me, the way that I learn best has always been to make first and then figure out what I'm doing second. And I think people often end up in these dumb debates that are like, “people should be able to make stuff without learning the fundamentals.” And then other people are like, “it's really important to learn the fundamentals.” And my take is yes, it's important if you want to go really far at some point, you're going to have to dig deep and actually learn what you're doing. And that's going to propel you. But, that shouldn't be a barrier to you doing anything. And so in my career, I got started in web development, just throwing together Rails apps. And I didn't really know how to program. I didn't know Ruby. I was just sort of copy-pasting and messing around and I fought through the pain just cause I wanted to make and share stuff. And I think you're, you're exactly right that the flip that I see when people start using ChatGPT is all of these frustrating moments that before took incredible dedication to fight through because they were so frustrating and programming is full of these absolutely full of these things—you're missing a semicolon and it takes you three hours to realize that that's why your thing wasn't working. That's so demoralizing and People who don't have access to a friend or tutor who can help with them with that. There's just a huge drop-off chance, I think, at that point. And when I'm using ChatGPT, even now, I'm a skilled programmer, but I'm often working in areas that I don't know as well. Having ChatGPT with me just feels like the default flips to, I have flow, I have momentum, and I have this, this sort of support that's going to make sure everything goes okay. And I'm just less worried about getting stuck. And I think that that feeling is really qualitatively different. And I agree when people realize that it's a really exciting flip for them.

Dan Shipper (00:11:47)

Yeah, it really is. So I think that that sort of brings us to,the, the main thing that we wanted to do today, which is… In most of these episodes, what we're doing is we're going through historical chats and then, and then we both kind of interact with ChatGPT and we explore something and find things that we never would have found before.

And what you suggested, which I think is brilliant, is why don't we just build something together? Why don't we build an app? And I think in the process of building an app, people will be able to get just a little bit of an idea of what you mean by malleable software, what this future of being able to modify things is going to look like.

And then two is they're going to be able to see what are the specific ways that you're using ChatGPT to achieve these results, in just a very, very detailed way. And we'll try to make it so that if you're a programmer, you can get a lot out of it. And if you're not a programmer, you'll be able to understand what's going on and you'll be able to see it, get a little bit of a taste of what would it be like to push myself in this way a little bit and try to build stuff. And I think it'll be really cool.

Geoffrey Litt (00:12:47)

Yeah, I'm excited to try it out. And maybe just as a preamble, I can talk a bit about how I think about this task that we're going to do. Right? So,what I've been trying to do in my work is, sometimes there'll be a brief moment when I'm in the middle of something and I have this thought that's like, “Oh, I wish I just had a software tool that did X.” And, again, this is getting out of the hotel mindset. And I've been trying to notice those moments and, and think, “Wait, like, could I actually make that?” And, before maybe that would have taken a day. So the answer is like, “No, not worth it.” But now if the answer is like “Five minutes,” maybe, right?

And so I've been trying to notice those moments and, I've come up with a workflow that's very, very simple and crude, but has worked for me a few times for making these sort of quick apps that help me with stuff. One small example of one that I built before, is I was prepping for a trip to Japan and I actually grew up in Japan and I speak somewhat fluent Japanese. But I have some sort of pockets of missing skill, particularly in more formal communication. And I was on these text message threads with some of my mom's acquaintances who I don't know as well. I mean, I needed to sort of text them in a way that was correct to the context, and I was just struggling.

And I was doing all these ChatGPT chats to try to help me with the translation. And it was really helpful, but I kept hitting these really annoying Chatsituations where I would be like, “That sounds too formal. Make it sound a little more casual.” “Oh, like that sounds too casual. Make it sound a little more formal.” And so what I did in the end is I made this, this UI tool that, you can do a translation and then there's a little slider to adjust how formal the translation should be. And that was just way more, way easier, way more fun. And it sort of encapsulated a lot of the wisdom of the system prompt I had been iterating on in a nice GUI tool that I could then just whip open whenever I wanted.

And so that's sort of what I mean when I talk about these little helpful software tools that I wish existed just for me. Right. And so that's I think the kind of thing that would be fun to try to, to build together. 

Dan Shipper (00:14:50)

Okay, cool. Well, let's find it. Let's find a tool to make, I know you have some ideas. I've got some ideas. Why don't you start and we'll just kind of go back and forth until we find something we like. 

Geoffrey Litt (00:14:59)

Yeah. So, one idea I had was I'm a guest on your podcast right now. And so what's like a utility that I would want to have while I'm a guest on your podcast, and I could imagine, maybe there's like a time bar that kind of shows me like, how are we doing on time? And so I have an ambient awareness of pacing sort of like, you can imagine it's like keynote presenter mode, but specialized to being a guest on your show. Maybe there's a checklist of like topics we want to, I want to make sure I hit with you and I can check them off. So I have this aid. I don't know if there's stuff, maybe as a host, do you have ideas for what you might want?

Dan Shipper (00:15:36)

Yeah, let's ideate a little bit because I think you're, you're onto something, this podcast is sort of unique in that ChatGPT is its own, like it's a, it's a guest and insert in certain ways or it's a part of it. And I really love to bring it in even more where like, for example, one thing that I think would be really useful, I often find myself wishing that we had a live transcription that could then get easily fed into ChatGPT and have ChatGPT respond to what's being said, and, I don't know if you feel equipped to do that or if that would take too long, but something like that would be really helpful, because I'm often sort of, as we're talking, I'm often writing stuff into ChatGPT and then being like, “This is what they said, like, what do you think?” basically. And if there was an easier way to do that, that would be really helpful. I think one of the constraints is. It would work if it was its own interface. It would be even better if it was inside of ChatGPT somehow. That's probably going to be really hard to do, but just sort of thinking, maybe the minimal thing is like real-time transcription. That's really easy to either get into ChatGPT or to just have GPT give some sample questions or some thoughts like in real time as things are happening that could help push us in new and interesting directions. 

Geoffrey Litt (00:17:09)

Okay. So two thoughts, first of all, at a meta level, we should get ChatGPT in on this brainstorming session in a second, because one really important thing is that the moment for Chat to get involved is not like when the idea is fully formed. This is a huge part of my philosophy on this stuff is that ChatGPT is a muse, not an oracle. So it's not like we will craft the perfect app pitch and then bring it to ChatGPT. And then in one shot, it will generate the perfect app and then we're done. It's like a designer or or an engineer: the earlier you bring them in, the more they can contribute to the ideas and the more context they build up.

And so, we should do that. Second brief thought is, this is actually getting to one of the hardest parts of this process that I think least-well served by ChatGPT currently, which is you asked me, “Could we like do this? How hard would it be?” And, I'm a programmer. And so I have a lot of context in my head for helping to assess very quickly, like on a scale of 1-to-10, how feasible is what you're thinking of and, I think one of the biggest challenges that Chat isn't as good at yet is helping people who aren't programmers figure out how hard is this going to be? Is it even possible? And so when I build these apps for myself, currently there's a lot of that background knowledge I have feeding into the process and helping it along. And so one thing I'm excited to explore in the future is, can we make these tools better at basically telling you, “Actually, Dan, that's not a good idea. I get it. It would be cool, but it's just going to be too much work. How about, let's try this other thing instead. That's what senior engineers do, right? So, That's the process going on right now in my head.

Dan Shipper (00:18:53)

I think you're totally right. And it's something that I see in my course as well. People just go into these… people get grand visions, they have these big ideas, right? And that's what motivates people to build stuff. And I'm constantly sort of like being, “Okay, your practice is to figure out what is the core smallest thing you can do and just do that. And, and use that as a stepping stone to build the more complicated thing later.” But the big failure mode for people is they try to do something way too big at the beginning. And then, and then they're like, “Well, this isn't going to work” or whatever. And they just get lost in this rabbit hole and finding, finding that little small thing that's useful to start, even if it's not your big vision is like the best way to build stuff. 

Geoffrey Litt (00:19:33)

And it's classic lean startup sort of iterative agile thinking. And the really cool thing is Chat can lower those iteration cycles so much. So, I was prototyping a game at a hackathon earlier this year and I was just trying to have fun at this hackathon. I wasn't trying to work hard and I wanted to prototype different ways the game could feel. And so I would just say to Chat, what if it, “What if the car moved this way?” And then I'll go off and talk to people, and come back five minutes later. I have a new game. I play it. And I'm like, “Oh that, that sucks. Let's do this other way.” And so I think, it's doubly important when using ChatGPT to realize the superpower you have now is that iterations are fast. It's not that Chat always has the right answer. It's that getting a new alternative is much faster. And so your goal as a person driving it is to take advantage of that, iterate really quickly and try a bunch of stuff really fast and then respond to it yourself and sort of see where it goes. So I think we should try that. One thing we could try is just starting with a very minimally scoped app that has like a clock on it or something. And then we'll see that working and sort of like, we'll have more ideas riffing on that and sort of we'll just go from there or something. 

Dan Shipper (00:20:48)

Let's do it. I love it. Okay, let's do it. So here we are. We're in Chat. And we're going to get started coding this little app. And I want to point out, I got super excited about this whole real time transcription thing and I think you're kind of like, “That's probably a little too big to do live in—I don't know—we have like 30 or 40 minutes.” So I think that's just, that's just such a really important thing to note is that this happens all the time in programming. It's a normal thing to be like, I've got this amazing thing.

And then to be like, “No, no, we got it. We got to pare it back to like something that's useful that we can do in the time we have. And then we can add more later.” 

Geoffrey Litt (00:21:28)

Yes. And so I think we should start with a super small thing and expand out from there. And that's something that, by the way … What I'm always thinking about with my system prompts for Chat and tools around this stuff long term is people don't just need help programming. They need help with product management and scoping and coming up with the right ideas to solve the problem and design. And ChatGPT can help with all that stuff too. And that's really important to remember. 

Dan Shipper (00:21:56)

So lead us off. So how are we going to get started? What are we trying to build? Or maybe like, maybe the first step is trying to figure out what we're building with ChatGPT. Tell us how to get started.

Geoffrey Litt (00:22:06)

Okay, so we're just going to use this custom GPT. I actually just threw this together and put in a system prompt that I like. Maybe I'll show that before we get started using it. So you get a bit of behind the scenes. So here's what this bot basically does. It's a helpful AI coding assistant. Make sure to follow the user's instructions precisely because coding is a domain where sort of details matter. And I give it essentially a very specific opinionated stack for the code it's going to output.

React, TypeScript, Tailwind. This is a very popular set of technologies. It's one that I have a pre existing template for in Replit, which is this online coding platform. And I tell it, generate all the code in a single file. So basically, it's going to give us some code. And as we'll see, we'll just be able to copy-paste it into Replit and see what it does. So this is really important to constrain what it's doing in a particular technical way to get an output that we can work with easily. I'll note by the way, copy-pasting code from ChatGPT to other IDEs is not the best workflow in the world. It's obviously not how these tools should work in the future. Just a duct taped-together way that you can do it right now that I like to use for quick experimentation. 

Now let's talk a bit about the workflow. So, I think this might be the most important part of the prompt, so you get an initial idea from the user question two is, or part two is absolutely critical. Ask the user for clarification on parts of their idea that are underspecified. So we'll see this play out in a second: We're going to ask it to make an app and our idea is going to be vague. And what we don't want is for Chat to just run ahead and make up a bunch of stuff and guess what we mean.

We want to be in a conversation where it's going to ask us for help and clarification, and we're going to clarify what we mean together. Then once ambiguities are resolved, we're going to proceed, we'll make a plan for how the code is going to work first. That helps to generate correct code, and then it's going to write the code. Okay, so that's the basis. 

Dan Shipper (00:24:16)

That's really good. So I'm curious, how well in your experience is this? How good is this at following this workflow once you have it in your custom instructions for this GPT? 

Geoffrey Litt (00:24:28)

I've done a bunch of iterations on this prompt over time. My experience has been that asking clarifying questions—it's really good at that. I'm always amazed at how helpful its clarifying questions are. The hardest task that it's not so good at is knowing when to ask you to clarify something or whether to just fill it in itself. I try to resolve that by saying if there's some minor ambiguities, just make assumptions about what the user means and tell the user how you're filling them in. But sometimes it'll just barge ahead too quickly and other times it'll be too conservative and asking for too much input from me. It's like if you're an employee and you have a. a manager and you're trying to figure out what are the things I need to ask them about versus I can just go do myself. It's that dynamic, right? 

Dan Shipper (00:25:17)

That makes sense. I'm super curious to see how this goes.

Geoffrey Litt (00:25:20)

Alright, let's see how it goes. So, I'm going to kick us off with my goal, which is, I'm going to say, “I'm appearing as a guest on a podcast. I want an app that I can have open while I'm on the show to help me keep track of time and remember what I want to say.

Okay, so, great. We're getting clarifications live and I'm starting to read them and think through my answers, right? So time-tracking. Maybe I'll just keep going and answer these questions. Okay. Thanks. Okay, great. So we got answers. let's go through one by one and, I'm going to think through my answers to these questions.

So first, time-tracking, it's saying, do I need a simple stopwatch or a countdown timer? So I'm just going to say, I want a progress bar. Or I'll say digital clock plus progress bar. going from 9:00 a.m. to 10:30 a.m. Now, one really neat thing is we don't need the app to have a place to set the time start and end because it's an app literally just for this one appearance on this show and I'm with you today this morning from 9 to 10:30 a.m.

So that's going to be hard-coded into the app, right? That's part of the ephemeral software. We don't need extra stuff. Preload notes or add and edit notes during the podcast. I guess preloading is fine. And by the way, I'm using—

Dan Shipper (00:26:57)

We have a Notion link with notes. It'd be cool if it could display that.

Geoffrey Litt (00:27:02)

Oh yeah. Should it be able to show the Notion link? Or do you copy-paste in markdown from the Notion? What do you think? 

Dan Shipper (00:27:09)

I mean, ideally it shows the notion, it shows the Notion like in an iframe or something.

Geoffrey Litt (00:27:14)

Okay. So, it's funny. You just used the word iframe, so that revealed that you are thinking on the technical side of this too, right? And I think we might want to linger there for a second. And this is another instance of what I said earlier, where having background knowledge about programming is a huge accelerant to this process right now. And the reality is, this workflow we're doing, in my experience, doesn't work that well for people who have zero programming experience yet. I want to build tools that help get us there in the future, but it's interesting. 

So let's say we have our notes in Notion. Maybe we could show those, embed those somehow, or copy-paste them. I'll let Chat sort of make a call on how to sort of proceed with that. Styling or layout preferences? I like giving it a vibe here. One vibe I had in my mind is I kind of like the Keynote presenter mode. So I could just say like “simple, dark keynote presenter mode, vibes,” 

Dan Shipper (00:28:27)

I like that. Cause I feel like when you give it vibe, it kind of knows to be fuzzy about it rather than like very direct. 

Geoffrey Litt (00:28:32)

Yeah, for sure. By the way, quick meta note, I'm using the numbers here, which is just a great shortcut for responding directly to each of the things without too much time, 

Dan Shipper (00:28:42)

And by that you mean like it gave you four questions and you're using numbers to—

Geoffrey Litt (00:28:48)

Exactly, I'm just using the numbers one, two, three, four to refer to each of them. I don't need to say like for the time tracking thing I want, I just reduce extra words. Number four. Any other features? I think that we could have cool ideas in the future, but I'm just going to say “Not yet. start simple.” Alright.

Dan Shipper (00:29:12)

See what we get!

Geoffrey Litt (00:29:14)

So, it's going to do the plan first. The plan, this is really important. If you have it generate code without a plan, it tends to get stuck in weird corners that it can't get out of. And, having it generate a plan first, just like a real human engineer doing any coding work. Having a plan first really starts… So let's see, it's done. 

Dan Shipper (00:29:41)

One thing that's interesting is, for the notes section, it’s suggesting a text area where notes can be copy-pasted rather than doing the embedded Notion iframe thing. So that's an interesting decision it 

Geoffrey Litt (00:29:52)

Absolutely. Yes. We don't know why it made that decision. Presumably it's because it's easier. We can push it towards the embed later. It is nice that—I like having this early sort of planning section because it's a quick way to see what it's about to do. So we don't need to try to read the code. We can just. It's writing a spec document as a product manager that we get to look at and this all looks pretty good to me: Current time, progress bar, copy paste text area, a read only mode to avoid accidental edits during the podcast is kind of a fun idea. We'll see if it incorporates that. 

Now, let's see: The second thing it did is a pseudocode plan. As a programmer, this is really helpful for me because I can actually look at this and see if there's anything that looks like it's going to need to be fixed in there. So while it's writing the code, we can review that. 

Dan Shipper (00:30:47)

And it's not just useful for you. I think it's also useful for ChatGPT to write out the product spec, write out the pseudocode, and then actually write the code. And in the same way that it's useful for a programmer to write pseudocode, I think it's, it's useful for ChatGPT so it doesn't, it doesn't go off the rails. It can plan what it's going to be doing and all that kind of stuff. 

Geoffrey Litt (00:31:07)

Yes, absolutely, my general philosophy about this is, just, yeah, just like humans need to plan the right amount for the magnitude of the task… As a skilled programmer, I can go do a super quick bug fix or tiny feature without writing a whole doc explaining what I'm going to do.

But if I'm going to spend six months on a huge project, I better have a plan when I start. And so I think similarly about like, I try to calibrate my sense of how good is ChatGPT at this task and the worse it is the more planning is going to be needed up front and the more coaxing to make sure we sort of gently approach the goal. And so coding for me, this is sort of the right level of planning, I think, for this is not a huge app. It's a tiny little thing. So I think we haven't needed that much iteration. 

Yeah. Okay. So we got this code. I'm not going to read it. I never read this stuff. I just copy-paste and go.

Dan Shipper (00:32:02)

Why don't you read it? Tell me why. 

Geoffrey Litt (00:32:04)

It's a waste of time. Why would I? Why would I spend time reading this? Yes, I can read this, but it's dumb. I would rather just see what it did and use the thing. Maybe I'll read it 

Dan Shipper (00:32:14)

Okay. And you're flipping to Replit. So explain to us what this is: What Replit is and like how you got—what are all these files? Like, give us a, give us a background. 

Geoffrey Litt (00:32:25)

Yep. So Replit is an online coding environment where you can set up a quick environment to run any kind of code, and then you can edit it in your browser and have it running. And I can also share this link now with other people who can collaborate with me in this coding environment and use the sort of resulting application.

The reason I use it is because it's just one quick way to get running without a bunch of fuss and ceremony. And before this interview I set up just a little template that has sort of the tech stack that I told ChatGPT to use—it's pre-installed here and ready to go. I can share that as a template with you—as a link or something, but that's all I have going on here.

Dan Shipper (00:33:12)

That's really interesting. And I just want people. Anyone who's non-technical who's watching this to realize this might look complicated, but Replit is very templatized. It's very easy to just click a button and get something that looks like this and know where to paste your file. And B, you can actually… Everything that we've done so far is pretty natural language. You can actually get this far even with very little programming knowledge. And, and so if it feels intimidating, it’s really not that hard. And I think that's one of the wonderful things about this.

Geoffrey Litt (00:33:50)

So with that let's paste in our code and see what happens. Yeah, I'm just pasting from ChatGPT. This should update live, this little window here. 

Dan Shipper (00:34:02)

Oh my God. 

Geoffrey Litt (00:34:04)

Look at that. So, it has the time—it's correct. The time is the current time. It's going from 9-10:30. I'm just eyeballing it. That looks right. Right. It's 9:50, but the halfway mark is 45 minutes. Okay. Awesome. It did the simple dark theme pretty well, I would say. And then, let's see, can we type in this box? Okay, it has a box for notes. Pretty good, pretty good first draft so far.

Dan Shipper (00:34:35)

This is magic. This is crazy. We have to stop for a second and just appreciate how wild it is that we live in a time like this, where the amount of time and knowledge and effort that it would have taken just a year ago to do the same thing is sort of like mind-blowing. It's stunning how different this is. Obviously the code that the eventual code that has been written by ChatGPT is not that hard to write for like a senior programmer or whatever. But, still, it might take an hour or two or whatever, even for, even for someone who knows what they're doing. And this did not take an hour. It took five minutes. And, and it did, it also didn't require a senior programmer to do. Literally, you didn't write any code. Literally, you didn't even look at the code. You literally just typed here's kind of what I want and ask some clarifying questions. And now you have an app that the thing I love about this is it's styled and it has this cool progress bar that updates live.

Geoffrey Litt (00:35:34)

Yeah, it's so exciting. So. I want to analyze this from, on the one hand, I couldn't agree more with you. It is so cool and exciting. Even for me as a programmer, like you said, I wouldn't have spent the time to make this thing. And the fact that it's 10 or 100x faster for me to make increases the number of things I'm willing to make. I will note like, again, We're going to push it further and see where the limits are now, but we operated within a simple starting point and, as we push this thing further, we're going to hit more challenges. So we haven't solved all the issues yet, but this is, I agree. It's a very exciting starting point. 

One little thing I'll point out that's interesting about this app right now as an example of some of the drawbacks. So, this stack that I tell ChatGPT to use as my simplest sort of micro app stack. It doesn't save your data at all. So actually, if I reload this, and let me, I can open this in a new tab. So, here's the app full screen, I guess. And I can have notes here. but if I ever reload, they're lost. I know that limitation as the person who put together this tech stack.

And one of the reasons I chose that stack is intentionally because saving data often makes apps way more complicated. Now I have other stacks I can play with that I haven't set up for this that can save the data. But when I'm thinking of ideas in my head, I'm thinking a lot about things like, how can I scope this thing so I don't need to have that technical complexity? And that's a skill that engineers and PMs, you drill a lot, but normal people haven't thought about as much. So, I think it points to both, of course… In another version of this, we should have a GPT that can make apps that can store data.

That's a no-brainer, but there's a broader point, which is this negotiation of complexity of implementation and requirements is a delicate dance that we're going to have to work towards better tools that help people do that. 

Dan Shipper (00:37:43)

I think you're right. I also will note. So, definitely, saving state and doing logins and authentication, for example, are some of those things where you're like, yeah, that's, that's a little bit more complicated. Two, I think that those things are getting easier and easier over time. And, I can imagine because this is a single-use app, you don't even need a database. You can just save something to like a notes file or like save it in local storage or whatever. So I think that that makes it easier, but there are also services like Supabase or all these other things that just makes it super, super easy to interact with the database.

And what I don't want people to come away with is the idea that, I think you're right: There are all these hidden corners that you can see or maybe I can see that, we know, okay, like saving state is going to be hard, so we're going to scope away from that for now. And that definitely saves us time. But even if you're someone who's using ChatGPT who doesn't know that, you're going to find that out because you're going to be like, “Hey, can we save state?” And then you're going to get stuck for like four hours. And that's actually the only way to learn. So it's actually not bad that you don't know that. It's just that, I think what you're actually saying is not that normal people who don't have a lot of programming experience can't use ChatGPT for this like they can, it's just it will take them longer and they will run into problems.

It's not like ChatGPT is going to solve every problem for you right now. There are still things that experienced developers are going to know and be able to push the Chat to do and not do that is going to save them even more time than first for a normal person. But it's still quite useful for someone who has very little to no programming experience. Yeah, it sometimes is not going to solve every problem for you, just some of the problems.

Geoffrey Litt (00:39:24)

Yeah, that's a great point. I'm not trying to discourage anyone from using this workflow. If you don't know how to program, just be curious, ask how hard it would be to do various things, and try to get those answers.

One quick plug I'll give is the research I'm doing. So I work at an independent research lab called Ink & Switch, which has pioneered a software architecture called local-first, which has a bunch of interesting benefits for users like data privacy and ownership. But actually, one of the most interesting benefits for this use case is that we're trying to make it really, really simple to make an app that stores your data, can sync it with other people where you can share data, have it all saved privately. And that shouldn't require setting up some server that you have to run and thinking about operations, it should literally be like one line of code and you're off and running, you're storing data, you're syncing it. And so we're doing a lot of work right now on trying to create an environment based on that local-first architecture using a library at Ink & Switch called automerge, where when you make an AI-generated app, you should be able to plop it into that environment and instantly you get authentication, data sync, data storage, all out of the box for free, no servers in the mix. And I'm really excited about that as one specific future thing to make it easier to build really full functioning, tools that go beyond just a little stateless thing, right?

One specific example here is that I'm not going to do this today, but in the future, if I have my notes in Notion, maybe we'll try embedding this thing, but the app should be able to maybe load my Notion notes directly into this view in a different way, and access those existing notes I have without me needing to copy-paste them, right?

That's the thing I want for the future, but maybe do you want to keep going with this demo and see if we can get ChatGPT to save our notes in this? 

Dan Shipper (00:41:20)

Let's do it. Yeah, that'd be great. 

Geoffrey Litt (00:41:22)

Okay. So, let's give it a little bit of encouragement. This is a great start. 

Dan Shipper (00:41:27)

Always got to encourage the AI in case it takes over.

Geoffrey Litt (00:41:30)

Let's be nice and, yeah, gain brownie points. But actually also I find that I want to tell it that it's on the right track so it doesn't freak out and totally re-do everything. “Is there some way we can save the notes that we've entered in the browser so they don't get lost when we reload?”

Dan Shipper (00:41:57)

And I want to point out that's a question that anyone can ask. I'm sure you have some thoughts about the way that it should do this, but we'll see how good ChatGPT is at finding the answer that you would have gone with. 

Geoffrey Litt (00:42:10)

Exactly. It said an answer. It's going to say, we're going to save them in local storage. As an engineer, I know that that's a perfectly fine way to think about it. And then it's just going to output all the new codes. So, generally for little tools like this, I just tell it, the system prompt, I think, says to just output the entire new code and that's really the, the simplest thing you can do. And it's nice because what I'm going to do is just copy this and paste it into Replit again, once it's done, and we'll see what it changed. Sometimes for larger things, I like to tell it a different prompt, which is to generate minimal edits and only tell me the parts that change just cause it's faster. But that is a little bit more annoying cause then you actually have to like start thinking about where you're copy-pasting. and that can be a bit annoying. Okay, so, I pasted in the new code. There's no visual difference. I'm going to reload to make sure we got the new version. These are my notes.

Let's reload. It worked! Ah! Amazing! And if I come over here and reload. Reload. Reload. Okay, the notes are saved. 

Dan Shipper (00:43:25)

That's amazing. And one thing that we should be clear on, like, that website is live. Like, you can send me that URL and it's live. It will not save the notes. I'll have my own version of the notes. So we each have our own notes, rather than there being one common note that, which is an important detail to point out. 

Geoffrey Litt (00:43:45)

It's funny too. You just, again, used your programming knowledge to, to say that. We could have also asked chat, “Does everyone using the app share one note saved or does everyone have their own?” 

Okay, so every user has their separate and unique set of notes. Great. Okay, 

Dan Shipper (00:44:12)

So, there's something really interesting going on here for me. Like this is such a different way of thinking about how to build programs, not because it's just AI-built, but, for example, having everything be in one file, or saving things locally is just, it's a different paradigm from the current way that we build SaaS apps where it's like microservices or like breaking up into modular components, and like having, having databases and authentication or whatever. And it's this fundamentally new thing that is only possible because you want to build bespoke apps for like small use cases that are used by single people. 

And that's like, that's actually just like a new world that is starting to blossom a little bit that we don't, we don't know where it's going to go, but I just want to underscore for people how much, okay. So there's this new workflow, which makes people incredibly more productive. It gives people who can't code the ability to build stuff. So it's taking people from 0 to 10, right. And then it also takes people who can build stuff and it makes them. I don't know, 30 percent faster or whatever, but I think what's really important that you mentioned earlier is it's not just about speed upgrades, it makes it possible for you to build things that you just wouldn't have put the time into before.

Like you just wouldn't have made this before at all. and so maybe you make 10 or 20 more things in the world per year because of this that you wouldn't, you wouldn't have made previously. So. Big performance workflow difference. But then also it's like, it's a different kind of software. It's just different—it's a new thing. There's something coming now that's different from SaaS that is enabled by exactly this stuff. And we're just starting to see what it's like. And this is like the earliest inklings of that. And it's so cool to see it.

Geoffrey Litt (00:46:09)

Exactly. One thing I love, if you look at this app, it's so simple. It has nothing I don't need because we're building it up from zero. And I've been finding in building these little tools for myself, one question you might ask is like, “Wouldn't it be better to go find some existing app?” because someone else who's better or who's either, more skilled than you at coding or design or has just spent a lot more time thinking about it. Maybe there is a podcast guest app out there or something. I haven't looked, but in my experience, a lot of the time it's actually faster now for me to just make the thing that has the tiny features that I need than to go try to Google which one is the best and learn how to use it. And I love the pared-down kind of like nothing-is-there-unless-I-specifically-added-it-to quality of these micro micro tools. 

Dan Shipper (00:46:58)

Yeah, that's really cool. You know what this reminds me of? Have you been looking at what Jason Fried and [David Heinemeier Hansson] are doing at 37signals? They have this new I guess software company underneath 37 signals. It's called Once. And, basically it's on-premise software for consumers. They're making some sort of app for like prosumer business people, where when you buy it, instead of paying a SaaS fee, you pay once and then you get all the code. The code is not minified or bundled or whatever. It's just like this. It's mostly in one or a few files and you can read it. And it's owned by you, modifiable by you, and I think you're pushing this forward from a research direction, what's possible to enable this stuff. And they're already sort of thinking about, okay, how do you commercialize this new kind of software? How do people pay for it? And all that kind of stuff. I think that's really interesting. 

Geoffrey Litt (00:47:54)

Yeah, I love that sort of direction. And in my research at Ink & Switch, we're pushing towards, again, this new kind of software distribution platform where you own your tools and you have the capability to modify them. 

That's another quick point I want to make that's really important to me is that starting from zero and starting from scratch isn't always the ideal workflow. Often what I actually would prefer is to start with an app that someone else made that's almost right, but I just need to make a small tweak. That's something that's much harder in today's software world, because often, like I said earlier, you're not allowed to make that tweak. You can't do it because of infrastructural reasons. And so what I'm showing here is kind of the easy path that works in the current world, which is just to start over from scratch. But I think actually in the future, there'll be less starting over from scratch and more sort of modding and remixing. And that's going to be possible once. Imagine I send you this Replit link. You can look at, you can actually take that code… One thing I do sometimes in Chat is you could make your own ChatGPT session with this bot and say, “Hey, I'm starting from this app and paste in the code.” And say, “what I want to do is add this other feature” and it will just pick up that process where I left off and it's in your hands now and someone else might do it—

Dan Shipper (00:49:09)

Should we do it? 

Geoffrey Litt (00:49:11)

Yeah, do you want to try it? 

Dan Shipper (00:49:13)

Let's do it. 

Geoffrey Litt (00:49:15)

Okay, so do you want to simulate it where I, I make a new Chat basically, or do you actually—

Dan Shipper (00:49:16)

No, no, no. I want to do it.

Geoffrey Litt (00:49:18)

Okay. Well, yeah. Let's do it. I love that. 

Dan Shipper (00:49:22)

So, send me the REPL, and then I need a link to your custom GPT so I have the same stuff. 

Geoffrey Litt (00:49:29)

Yes. Oh, this is going to be fun. So we got the REPL—

Dan Shipper (00:49:37)

So you should be able to see my screen now, right?

Geoffrey Litt (00:49:40)

Yep. 

Dan Shipper (00:49:42)

Okay, cool. So, okay, so you took that REPL that you just made and, and the REPL is basically just all the code we wrote in ChatGPT and you sent it to me. And what's really cool is with Replit, like I can either press “run” and it'll just run it. For me, and that's really great, like this is a live thing that's just running on the web right now, or I can just press “fork” and, I can make “PodcastGuest (Dan's Version)” “way better than the old version,” and then I can press “fork.”

And, now I have all of the code that you wrote with ChatGPT, and it's somewhere in a source. 

Geoffrey Litt (00:50:24)

Look in source.

Dan Shipper (00:50:25)

It's in source. Okay.

Geoffrey Litt (00:50:27)

App.tsx. 

Dan Shipper (00:50:28)

So it's right here, and that might be a thing that would take you a little while to figure out, but again, you could just throw all of this folder structure into ChatGPT and it would be like, “This is probably where the code is.”

And so now we've got to figure out what we want to do. We have this sort of initial thing that has a timer and has a note section. Okay, let's brainstorm a little bit. One thing we could do is, we could have a little window that takes the notes and then asks GPT-4 to come up with sample questions.

Geoffrey Litt (00:51:11)

Ooh, yeah, that's ambitious. I'm into it. I mean, I think 

Dan Shipper (00:51:16)

I mean, I think that's pretty doable, right? Because, I mean, really all we're going to have to do is take the notes. Well, we should, maybe we should ask ChatGPT. But take the notes, send them up to GPT-4 with a little prompt and then just display the answer somewhere. We might—

Geoffrey Litt (00:51:30)

Yeah, I’m into it. I think we should try it. Yeah. I think applying again, my engineering knowledge, the challenge is going to be making sure we finesse the API call to OpenAI correctly is something that I've sometimes find working with APIs can be a bit challenging because APIs change. It might not know about the latest format. Something that's going to come to mind is it's going to be really helpful if we give it like a successful example of an app that actually did a good job calling the OpenAI API. So we could try that pattern of, I could send you a link to another REPL where I've already done a good OpenAI call and we could tell it like “Use this app as sort of like a sample.”

Dan Shipper (00:52:15)

Well, what I want to do… I mean, the way that I usually get around this—and I think you're thinking about exactly the right stuff—is just paste the GPT-4 API docs in there. So it knows how to call. It should have web browsing, but let's just try it.

So. I'm going to say something like, “I have a web app that I use to track my podcast recordings as I'm doing them and I want to add a feature. Here's the code I have so far. So I think just giving GPT the context is probably pretty important.

Geoffrey Litt (00:52:59)

Yeah, absolutely. 

Dan Shipper (00:53:00)

So I'm just going to throw it in there and see what it says. Yeah. So, okay. I want to add a button. So it's basically saying, “Great, I see you have a basic web app for tracking podcast recordings. Could you please specify what feature do you like to add to your app?” I want to add a button that says “generate questions where it takes the podcast notes and then sends them to GPT-4 and return and displays the list of questions that GPT-4 returns.” And then the little note here is, when you're working with APIs, as you said before, and an API is like the GPT-4 service, right? The GPT-4 service has a way that you interact with it. And that changes over time as they make updates. And, ChatGPT is not always aware of all those changes. So the best way to. work through that is to just go to OpenAI.com or wherever the API is and look at the documentation for the API and just give it to ChatGPT so it knows, okay, here's actually how we call the API. So let's see, I think this is going to be good. So I just found an example of how the GPT-4  API is structured and I'm just going to paste it—

Geoffrey Litt (00:54:47)

One quick note is you just copied some Python code, Dan, and we're in JavaScript. So that's a mistake that—

Dan Shipper (00:54:50)

[laughing] I'm just used to writing in Python. 

Geoffrey Litt (00:54:55)

This is a thing that, again, there's some programming knowledge to even know which of these things to copy, right? But I think a node one is gonna go better. 

Dan Shipper (00:55:02)

Okay, so thanks. Good note. I'm just going to paste it in there and, see what it says, see what it does. So basically it's saying—okay. It's reflecting back to me. Here's what I think you want to do. “Add a button to the existing UI, create a function that sends the notes to GPT-4 and then display the received questions in your app.” And then it's creating a plan. So “add a generate questions button, create a function that takes the current notes, sends those notes to the OpenAI API, and handles the API response to extract the questions. Create a new state variable for storing the questions and update this state with the received questions, then show the questions in your UI.” That all sounds pretty reasonable to me and I'm going to do what you recommended and just copy-paste.

Geoffrey Litt (00:55:54)

Yeah. Quick warning. It did something interesting, which is that it elided some code. It said “existing code” in a few spots. So it actually hasn't given us a full new file that we can just copy paste. I would recommend just telling it “don't omit existing code, just write a full file that I can copy.”

Dan Shipper (00:56:14)

Let's see if that does that better. And we're also going to have to set our API key, which it's reminding us to do, and I have an API key I can use. And for people that don't know, the API key is just, you have to identify who you are when you make requests to GPT-4 so that OpenAI knows who to charge. And so you have a key.

Geoffrey Litt (00:56:35)

This is another good example of a tricky thing where I can see a problem in this code already that it's going to try to use an API key assuming that it's running on a server because OpenAI, usually their docs assume you're running like a server that's querying them. Whereas in this case, we're running an app in a browser and we have to set up the API key a slightly different way. That's kind of a subtle thing in some ways that can trip you up if you're not aware of that. 

Dan Shipper (00:57:07)

And again, it's one of those things where we can try this, we'll see what error we get, and we'll throw it into ChatGPT and see if it can solve it. If not, we'll just solve it so that we can skip to the fun part. But you're right, there are these little micro moments where it's not quite right. And it's helpful to have some sense of what you're doing, so that—

Geoffrey Litt (00:57:30)

Like you said, if you don't know what you're doing, you can just see what happens and, yeah, tell it to fix it so that it's often fine. It's just that if you know what you're doing, you can avoid some rabbit holes and makes faster progress. 

Dan Shipper (00:57:49)

Alright. So here we go. We're going to copy the code. We're going to hold our breath. We're not gonna read the code. And we got an error!

Geoffrey Litt (00:57:55)

Okay. so we don't have the OpenAI thing installed— 

Dan Shipper (00:58:00)

Right, so I know what to do. I, sorry, this is in JavaScript, so— 

Geoffrey Litt (00:58:06)

Yep. You don’t want that. Probably “npm install.” You could’ve asked Chat for that one to be honest.

Dan Shipper (00:58:12)

What did you say?

Geoffrey Litt (00:58:13)

We probably could’ve asked Chat how to fix it as well.

Dan Shipper (00:58:16)

We could have asked that. Yeah, that’s true. I'm getting impatient. I want to get to the magic. Well, it looks like we’ve got a broken UI here. 

Geoffrey Litt (00:58:34)

“Process is not defined.”

Dan Shipper (00:58:35)

So here's what we're going to do. We're just going to copy this error and paste it in to ChatGPT and see what we get, unless you have some other— 

Geoffrey Litt (00:58:47)

That's perfect. Let's do that. 

Dan Shipper (00:58:50)

Okay, I got this error. “Typically occurs when environment variables are not accessible in the client-side JavaScript. This is common in projects with “Vite” as it doesn't automatically make environment variables available in the front end. It’s the OpenAI API key.

Geoffrey Litt (00:59:06)

This is a good example of where it's telling us some stuff. We could do it this way. I think that it's kind of going to be a pain to set it up this way. One thing I'm thinking about is, so you could just hard code an OpenAI key right into the code here. Now, yeah, we need to be careful because, you're going to have to blur that out on the final video or something.

But, often with this stuff… oh, yeah, maybe you can just—

Dan Shipper (00:59:10)

This will just work. We’ll probably cut some of this out. It’ll just figure this out.

One thing I’m worried about is like this is all client-side there's no server. So I don't know if it'll work. 

Geoffrey Litt (01:00:01)

 It will, but there are security issues here. Now, if you were to share this REPL link it's possible that anyone who uses it would get to use your OpenAI key, which is a big problem. Oh, you need to pass in the API. Yeah, this doesn't work because we're not on a server. 

Dan Shipper (01:00:25)

Yeah, that’s why. We’ll just set it.

Geoffrey Litt (01:00:28)

Alright. Just YOLO it.

Dan Shipper (01:00:31)

Do you remember—Okay, let’s see…

Geoffrey Litt (01:00:33)

The error message said it. So actually, we can do it this way. I think if we do what Chat said, we'll actually be fine. You just need to rename the Replit secret you set to be, “VITE_OpenAI.” 

This is a good example of annoying programmery stuff that shouldn't be necessary to do. 

Let's try that. 

Dan Shipper (01:01:05)

Alright. Running again. Holding our breath.

Geoffrey Litt (01:01:05)

This is how these things really go. It doesn't always work the first time. That's a part of the process. 

I think that it wants you to put theAPI key… around the API key in the error message. It says, yeah.

Again, we probably could have given that to Chat and had it help us with that, but—

Dan Shipper (01:01:40)

We're running out of time here. 

Geoffrey Litt (01:01:40)

Okay, so yeah, it's fine. We need to set “dangerously allow browser” to “true,” because it doesn't like querying it from the browser, but that's okay. We're making a little app just for you. So it's going to be fine. Great. Again, it’s subtle, though, because understanding why this is dangerous and what's okay to do and what's not okay to do is a bit tricky.

Dan Shipper (01:02:10)

Alright, I’m going to press run and we're going to move over into our web view. And here it is, we've got a button. It's called “generate questions.” That's pretty cool. 

Geoffrey Litt (01:02:25)

Let's see if it works. 

Dan Shipper (01:02:27)

Yeah, let's see if it works. What I want to do is just move this. How do I move this down? There we go. Okay, cool. So what I want to do first, we have a bunch of notes for our interview. So I'm going to take this and, I'm just going to throw it in here. “Here are some notes from my guest.”

Geoffrey Litt (01:02:54)

It might give you better questions if you paste in the entire doc because then it'll know more about your podcast and the vibe you're going for. We have our timer counting down. We can see it with the progress bar.

Dan Shipper (01:03:10)

I know! Are we going to make it before the end? Okay. So I pasted a bunch of notes and I'm going to press “generate questions” and we’ll see what happens.

Geoffrey Litt (01:03:17)

Let's see what happens. So my guess, my intuition is it's not going to work the first try. But we'll see what happens. Have the dev tools open so you can see if it breaks or something. 

Dan Shipper (01:03:29)

It says connected, there's no errors. 

Geoffrey Litt (01:03:31)

This is tricky, right? Because we have to guess, maybe it's working and it's just taking a while. It's totally possible. It could be that it's going to break. Can you scroll down in the app and see if it's showing anything yet? In the, in the app, not the code. We just need to find out—

Dan Shipper (01:03:47)

There we go! We've got questions. 

Geoffrey Litt (01:03:51)

Wait, oh! It made a really weird UI for it. So we have questions. 

Dan Shipper (01:04:00)

Okay, “Here are some prompts to discuss with Geoffrey Litt on your podcast episode. After welcoming Geoffrey to the podcast, ask him to give us a brief introduction about himself and what he does. Dive deep into ChatGPT use cases.” We love that. “Can you highlight some transformations or milestone moments in your professional work due to AI?” “How do you envision the future of AI and day to day tasks and professional workspaces?” That's a good question. I really like that one!

Geoffrey Litt (01:04:20)

I think we don't have time to go too much further on the app right now, but one thing that gets me—so one thing I love about this process is I'm responding to what it did, right? So obviously this UI is really janky. Like it needs some space between the two boxes and we can tell it to do that. But also I'm thinking, maybe it would be nice to see each of these questions in its own little box or something and maybe you could check them off as you go. And that's another idea I just had by looking at this. And I think that starts to point towards… Some of the advantages of doing it so you could have just done this in ChatGPT itself and not made an app. And I think for what we have so far, it would have been pretty similar because it's just giving you text. But the further we push into a custom UI for kind of maybe you want to reorder the questions and you could have it build a UI for dragging and dropping your questions into a different order. All that stuff is what comes to mind now. And that's stuff that, because we're in this custom UI, all of that is possible and those possibilities occur to me in a way that wouldn't if I was just in the chat box, right? 

Dan Shipper (01:05:22)

I think you're totally right. ChatGPT already has code interpreter where it can write and run code for you. And I really think there's a world where instead of pasting into Replit, especially for these mini one-off apps, you're just using UI that is constructed on the fly in ChatGPT, and then modifying it, and then that becomes a custom GPT you can use for a while, and you can already see this. In the Google Gemini demo, for their newest language model, it does that inside of Bard and I really think that’s where we're going for a lot of this stuff. 

Geoffrey Litt (01:06:01)

I totally agree. And in fact, I think often people aren't going to even need to ask, “Make me a UI that does X.” Really, the bot should just decide, when I ask for X, it should just pick the best UI for that task, which might be text or it might be a custom whole thing, right?

Dan Shipper (01:06:20)

Totally. So this was pretty awesome. We came up with an idea. We built the first version, then you sent it to me and I made some modifications, which now we can send back to you and you can keep going with it. You have a bunch of ideas for me to take it like this is sort of the future of building stuff.

And we did it in like an hour. And I think that's so incredible. 

Geoffrey Litt (01:06:50)

I know it's so fun. And we were able to just kind of have fun and talk while we were doing it. We never got totally stuck. And I think that's the feeling that I want when I'm building stuff and I think everybody wants when they're building stuff of effortless flow.

And I'm really excited. I think LLM-based tools are sort of on a path to enabling that for way more people in way more situations. 

Dan Shipper (01:07:09)

Yeah. A hundred percent So as people are coming out of this episode, they're inspired. They want to go do stuff. They want to learn more about your research. They want to think about the future of where this is going, where do they find you and what should they read?

Geoffrey Litt (01:07:24)

Yeah. I have a personal website geoffreylitt.com where I post various research. I wrote an essay earlier this year called “Malleable software in the age of LLMs,” where I kind of lay out a bit more of the thinking behind this worldview. And, those are some places to check out more thoughts.

I'll be publishing more research in the coming year or two on how do we take this workflow we just did and actually make it really awesome and integrate better into sort of a whole coherent work environment with less copy-pasting and sort of less dealing with infrastructure. So look forward to that too.

Dan Shipper (01:08:00)

Amazing. Well, I'm super excited when that comes out. I would love to have you back. This was incredible. I’m walking on air right now. Like there's so much good stuff happening here and I really appreciate you taking the time to walk us through this. 

Geoffrey Litt (01:08:18)

Thanks so much. This was really fun.