Hackathon App Part 2 - Building SaaS with Python and Django #62

hi welcome to building sass with Python and Django my name is matt lehman and i'm the streamer for the streamer we work on Django applications so it's a Python web framework and I walk you through building Python apps specifically on a project that I'm working on for a home school application normally but today we're doing something different last week I mentioned that I'm working on a local hackathon it's a virtual event something I'll share a link in the chat over here and it's for no good causes in my local community I emphasize the point that if you're able to help your community in some way you should try and do so and so that's what I'm doing with this hackathon it's also an opportunity to work with other technologists who are in my area and we're going to continue on the path to building the application that were that the group is building I think last time I described the application and at the end of the stream I said there's gonna be one of two outcomes either today will be a show-and-tell and then get back into the home school application or I'll be frantically trying to finish the remaining pieces I arrow Mike welcome thanks for joining in and as it turned out the last week has proved that we're gonna fall more into the latter category today we've got some stuff to do my presentation is tomorrow at noon my time and there are some pieces that are not done so we for our application as a reminder of the application is something that's for student homelessness it's for a group I live in Frederick Maryland and Frederick is in Frederick County Maryland so the group that I'm doing stuff for is called ship of Frederick County and ship stands for the student homelessness initiative partnership I think but what they were asking for is some capacity to enable people that are homeless in my community that are younger student age they might not they they might even have homes but be a resource-constrained like don't have provision at home for you know providers that can help feed them get them all the meals so there's a lot of people that are in their community like that and these folks tend to have phones so I'm told and so we're making a resource site for them that gives them quick access to the things that they want to they want to use last time we worked on some of the the main views of the site trying to put them together with the information that's gonna be needed we looked through some of the models that went into this and so on in the intervening time I have met with the sponsor for the group and he has given us some direction on things to do we've also had opportunities to sort of refine the design and add functionality and we're gonna continue on that tonight before I get into that though I should say like if you want to keep up with me I've got a link above where you can sign up for my mailing list where I write about Python and Django I've got a gigantic django article coming out hopefully tomorrow assuming that I can fit it in with this hackathon project and I'm also on twitter as mb layman I'm on patreon as MB layman if you want to support me there I do want to thank my patrons of mark and Patrick and Eric and Rob for your support I really appreciate that oh and excuse me and Ahmed as well and I'm super grateful that you all are able to contribute in that way there's a discourse link below so if this course no excuse me discord get those messed up there's a discord link below there's a chat if you want to ask questions that don't fit in a tweet you're welcome to do that as well so that's what we're gonna do tonight is the try and finish off the app basically I don't have a job so tomorrow morning before the actual presentation is kind of out of the question so I'm gonna be finishing up the app as much as I can here today and make it as presentable as possible in preparation for the final presentation so let's talk about what remains to be done I'll show you the state of the app as it is right now and then we'll get going so what I have here I've got actually two sites presented one is the the real app for the repository or excuse me for the project and then the other is the one that was designed by our mocked-up either the designer on the team and I'm essentially trying to make sure that the that her design makes it into the application so here's here's the app we gave it a name we called it ship Haven as a resource site for people so Haven felt appropriate given that it's talking about ships and this is the app as it exists today there are essentially going to be in the end just three pages on this app and the the main page is going to be an index page and there will be an announcements page and there's going to be a service category page and I'll describe each so the the idea behind this is someone who is homeless who needs some kind of support will visit this this page it's a mobile web application and click on one of the categories that we have defined there's only six of them I believe and they they bucket the big kind of needs that someone might have and we have nice gigantic buttons here one of the limitations that's going to happen on the stream is you're going to see me working in the browser in the responsive mode and things might seem a little jumbo-sized but I assure you that we've been doing plenty of kind of testing on devices and even though things might look a little big here they seem very reasonable when you're sitting there with an Android phone or an iOS device it works out so what we've got is that the actual categories that we're going through whether that's legal advice money shelter education the big the big things that students who are struggling might need and that's the the primary interface on on this site and then at the bottom we have a space for announcements and then at the very bottom there's your standard kind of footer stuff but our sponsor also wanted a capability for someone to sign up and get email announcements or really any kind of push announcements but the thing that we're going to be able to do in a two-week time frame was email so we're gonna it's still missing some information here this onion that's here is a representative of Frederick County where I live I might look like Georgia to some of you but it's it's just meant to be notional of like here's the county and a form will go here that will ask for an email address I'm not gonna do that part tonight frankly it's not gonna get done before the presentation but that's where that and bid is intended to go so this page as you see it is essentially done there's some these are both buttons at the top that will bring up a dial 2-1-1 that is a service number that's available to Maryland residents I don't know if other states also make this to one one number of work I can't speak to that but I know that it works I know for a fact that it works in Maryland so if anybody needs service help they're able to get it and we wanted a that that was presented as the thing that need to be front and center to anyone who's homeless in case they have dire needs then we've got the list of categories themselves that allow people to drill into was important to them and got those all presented here and then at the bottom we've got these announcement briefs and if you if we click on one of them it will take you to an announcements page it was hard to tell but it would actually take you to the specific announcement so we're imagining a future where there's probably you know five to ten announcements at any given time and you want to jump straight to the the the meet of that particular announcement so the announcements page is done the main page is done there's one page left to do and that is the specific category page and [Music] you know something about responsive mode that I've noticed in Firefox is that my back button doesn't work I don't know if it's trying to simulate being a mobile device such that you don't get that back button but whatever we're gonna so we're going to use the top UI to get us back to the home and then we'll click in here and this is going to totally fail because I made the database change right before the stream started trying to get stuff done and I didn't finish it off so let's shift gears we're not ready to touch the UI yet there was some bit so there was some information that had to change and final pieces of information that the designer added of additional information about a service and we need to make those work before we can come back to the the user interface here and finish off the design I will say that you know my goal tonight is to do two things one is to finish off this page it is the the last page that needs to be fixed I think it's mostly there I've copied a lot of the template design over and we just need to add some polish to it once the data is in place the other thing that I will be trying to do tonight that is new to me I know it exists in Django but I've never done it before is a feed and RSS feed so one of the features that was requested by the sponsor was you know we're allowing people to sign up through essentially a MailChimp email signup thing and he was asking us you know how how can we get the announcements out there do I have to put them in on in the Django admin dashboard here and then also send out a separate email to the MailChimp in order to broadcast that that doesn't seem great so what can we do and as we discussed it there is a feature that exists in MailChimp that will read from an RSS feed and then automatically send out an email if you set up some stuff on that the MailChimp side any time a feed changes that is detected so the the secondary thing that I want to do if we have enough time is to get to that feed and make sure that the site is able to produce a feed that MailChimp is going to be able to read to send out announcements again this is a functionality that is that is a piece that's built in and Django so I'm gonna have to read documentation to you or with you I should say and we'll explore that together because I've never actually built a feed using Django's built in tooling so that should be a fun fun little adventure but let's start with the data that is missing and this is like teeny teeny tiny I can barely read it myself I'm guessing you as a streamer can hardly read it as well especially with any artifacts that might be coming from you know streaming compression so what this is saying is that we're essentially missing a column and that that I defined and so the the site is not working right now is trying to access information that's not there yet so I'm going to go over here and I'm gonna kill the the web server for a moment we don't need that running and and this is the template we'll get to in a minute and we're gonna switch over to the models file and this is what it's blowing up on right now so one of the things that the designer added was the notion of what organization is providing a service so for instance we have a group in Frederick called the Frederick rescue mission and they largely serve the homeless homeless men that are in the the city and the county that may be dealing with just lack of employment lack of residents drug addiction whatever is it's a it's a safe home for those those folks so we want to be able to call out not only at the service which might be something like daily daily lunches that they make available but also connect to them to the organization name it itself so we want to be able to split the name of what's being provided from the who that's providing it and so that's the addition that we need to add I think it's the only model change that's on the service frankly I don't remember how much of this model was fleshed out last time there was probably just a single address field and there were some quest and to make some data changes so if you're looking at this model and it looks dramatically different from last week these are just fields that were requested by the sponsor that really make the service impactful for the site so we're gonna do this we're going to go into the the test for this and make sure that this is tested so I want to assert that organization name has a value and that should fail because it's gonna be empty because as I've defined it in the model here in fact that's it probably even gonna fail we're gonna need to add a default otherwise Django is gonna say this is going to fail for any existing service you need to provide a default it's gonna complain about that so we are going to assert that organization name has a value for the factory stuff that makes our test data more accurate when we're doing some testing and then the other piece that's going to be needed is to actually go into the factories file there's a using factory boy which is a package that generates fake data and we've got a service factory that will create a service and so what we need to do is add an organization name and this time it's not really a perfect fit but there I know there's a fakir field called company that is close enough to an organization so I'm gonna say company and then just to prove that this is now working I'm going to add a nought and we can see the kind of data that that faker is adding Martinez Johnson I don't even I don't I don't get it what is it gonna say if we do it again oh it's doing like legal names when Montgomery and Anderson LLC or attorneys-at-law kind of thing cool so we've got an organization name in the with the service okay so what's left for the model is we need a migration I guess that's gonna be critical so we'll do manage pie make migrations and it should just add the organization name to the service model and we can look at what that looks like the migrations it is organization name and you can see it here it's doing an ad field on the model service on the model named service and and adding organization name that's all good okay next what are we doing next we must migrate so I have a local sequel line database that is actually the test data that we're working with and now we've added organization name so that should be present and if we start up the site again well actually before I do that let me stop here because I'm about to launch Heroku local the way that we are deploying this site and actually in fact if you want to view it yourself you're welcome to do so we put it up on Heroku it is at a one of the randomly generated Heroku names right now it's on the free account so it's gonna take a second to load but I just experienced that load but if you want to check it out here's the the URL to it and it doesn't have any of the data there yet but if you want to play with it on your phone or something like that you can do that if you're following along so here's what the what it looks like up on the actual site but Heroku doesn't work with sequel Lite and this is something I noticed in the forum the the Django forum there were folks that were asking about like my site it keeps them it doesn't keep data around what I've got to deploy to Heroku what's going on and as we dug into it I'll even type it out here sequel light doesn't work on Heroku and there's a there's a good reason for that Heroku is a platform as-a-service it it it will put your your application in their infrastructure and their infrastructure moves machines around frequently well maybe not frequently but enough that it's disruptive so if you try and deploy something there and you create a file in that deployment then as soon as that application gets moved from one server to the other that file that you added is suddenly gone sequel Lite which is a data by database that is in a file will blow up in that scenario because think about it you start the application you run your migrate command and it creates that sequel Lite file in that application instance on that server at that time and suddenly it's put in a different spot well now you have no database anymore so it's going to fail so instead you have to make your application connect to an external database hope excuse-me Postgres I buried the lede no well whatever Heroku uses Postgres as its kind of default database that you can use and that's what what we're using on this application so all of us data will be persistent no matter where the application is put but for local testing because this is not a complicated app and we're not using any of the advanced Postgres features it's totally valid to use a sequel Lite database but I'm also using Heroku local here as my command so there's a Heroku it used to be called the tool belt I think it's called the CLI now and it's a set of commands that you can run to manage Heroku to add new you know scaled up to horizontally to add new workers to it whatever you want to do but it also includes this local command which makes your application behave in a very similar way to how Heroku is going to run it which is to say that it's going to expect its configuration to come from environment variables so Heroku local will read from a dot env file and load that stuff into the environment and and run that way if you're familiar with Ruby there's another tool called Foreman that is is pretty similar and it runs a also runs the proc file which is the way that Heroku wants you to specify how your application is going to run so if I can't the proc file really quickly we can see that I'm running a G unicorn process with the application as project whiskey and it's dumping all of its log output to standard out and there's a release command that every time I do a deployment it will run the migrate command to any apply any new migrations so I don't have to do that in advance of anything or after the fact it will just be part of the release okay so enough context of the way we're gonna run Heroku local now and come back over to that page that we're showing an operational error and did I actually run migrate I did okay so this pledge page should load appropriately now and it's loading up all the images and here we go okay so this is the page that we need to add to and it's time to look at the template and fix the rest of it this is the service category detail page and the bit that you're seeing right now this this section is the stuff that is defined by this section block here so we need to come in here and add an actual service because without a service we can't see an example of the stuff that we're trying to finish off so what we're going for I'll show you what the designers version of this and put it in responsive mode so it gives it a fair shake is is something like this and this is pretty close you can see there's some wonkiness that i've already fixed with like the butt buttons in the top and there's some other bits that are there so we're going to be adding a section for each service that's going to look like this it will have the organization name it'll have the service name and description a little call-out link and then all of the buttons that will go into the service itself each of these buttons so here's a here's fun stuff that you can learn about doing web app development there are ways to to make the buttons behave better on on a mobile device the the obvious one is like an email you may have even seen this if you've done enough web development of having hyperlink an anchor tag excuse me and these so the a tag in HTML with an href value of male 2 : and that's standard and what that will do on your phone is actually bring up your mail client so that's kind of cool that the the mobile browsers know how to do that already if this one was new to me if you add an anchor tag that uses te l : followed by a phone number then it will bring up your dialer so you can dial stuff that way and then we have this other information that is going to give like this one if you click the address it should launch your your program sorry I don't know why I'm linked HUD on map but it should launch maps and I add a little bit of JavaScript that that makes that work between Android and iOS I'll show that in just a second and then finally there's just a plain hyperlink here that will take you to an organization's website so this is the the mock-up so we need one service to have this kind of information to prove it out and once I have one I think that'll be enough for the the stream to to satisfy what I think needs to happen and then we can move on to doing a little bit of cleanup of you that we're not going to need anymore and then move on to the feed stuff that I talked about and if you have any questions along the way about this project please feel free to ask this is meant to be kind of a back and forth if if there are questions that come up but otherwise I'm just going to carry on okay so I need to get into the admin and I'm running this at localhost 5000 so I'm going to launch a new page use the admin site and we'll add a service you can see there are absolutely none of them and so well let's use the service that the designer put in herself we've got the FCC a a I don't know Chrome Firefox is trying to simulate touch mode so I got to turn that off before I can highlight things apparently so that's going to be the organization name and then the name of the service is this Community Action Health Center and we'll take the description here drop it here and then going to copy the link the website and a street address see how that's so well she added some extra flair that that looking on it that's not really gonna work when you're on a mobile because there's no ability to hover so maybe she was thinking that if somebody's actually coming at this from a browser I'm not really sure um she's doing her darndest so can't fault her for that let's take the street address and this is going to be Frederick yep to 17.1 that's three area code let's do a quick lat/long lookup I found this cool service where if you give it a place like this it can give you attitude and longitude and I'm doing I'm doing latitude and longitude because it gives you can get a better more accurate link I guess to to Google Maps because they know how to do lat long very naturally and if you try and provide it just an address then it will do its best and probably do actually pretty well I would imagine given that it knows your location if you're on a phone but yeah if if we can provide the latitude and longitude to do this stuff all the better let's take the values here and plop them in there's a latitude and longitude and she's got the operating hours here you so there's some cool attributes here that I think are nice about the design which are pretty fun is we programmed in some colors so the service has a color and we used them we did this doing using tailwind colors so if you we've got all of this design is done with tailwind which is a pretty sweet CSS framework and if you do like background color you can get a bunch of colors and you can see they all follow this standard format of color goes in the middle and it's got B G on one side and a number on the other and the thing that we did that was kind of clever is that by giving a service category a color we could make all of a all of a related type and have a same same color output and so that what that's gonna do and I don't think I'm gonna add a separate service to show it off but you can hopefully imagine it is you know this one is a teal green color in fact it's B GTO 500 so we assigned the category of basic needs the teal color so all of that will be represented in teal and for each one each other category we also applied this color so we're dropping in the collar in and using it using standard names that the tail-end recognizes to quickly customize the look and feel of each category so it's a pretty effective way of making each category look like its own own uniquely designed page and I think it it came out pretty great in my opinion so let's finish this off oops I just copied the wrong thing shoot you we need to what I'm trying to do is make sure that this looks right and matches pretty closely to what what she has here so I apologize that this is taking a little longer exactly exciting streaming but sometimes you're just kind of mess around with the data and this is gonna go in the basic needs now that I guess another thing I can call out that's worth that is noteworthy no I don't want to create an address is if you're new to Django something that you can do like you might have observed that the stuff that I have on Heroku matches identically with the stuff that I have locally in terms of categories they are character for character matches and you can do that by creating what's called data migration let me see Django data migration straight to it David migrations aren't always the right fit but sometimes they're perfect for a job and the you can either run some Python or run some some SQL and I'll quickly show the migration that I did to populate the initial categories so if you run a data migration the migration itself is at the bottom and if you inspect migrations you can see that the operations are normally like migrations dot add field and they're generated by Django and and they instruct the database engine to issue data definition language DDL statements to the database to create new columns or drop tables whatever it is but you can also hook into the migration system to do extra things and so what i'm doing here is what's considered a data migration and you can read about it at that link and we can run some Python code and so the Python code that I'm running is this one right here that says add categories so I essentially get the service category model and I create a list of service categories that I want to exist in every environment and do a bulk create on them and so that means that in my deployment since migration is guaranteed to run this set of categories will exist no matter where the app ends up living so if we start a brand new site this site is too small but a more complicated site might have a variety of environments might have a development environment might have a staging environment might have a production environment you can use data migrations to ensure that content is exactly the same across them because it's it's constructed in code so that's a really cool tool where was I so we've we've added our bit of data save the community help Community Action health center here and that what we want to call this well let's add something to the admin over here because that's not a very descriptive name we need to make that better so the service category admin is just showing the name of the service but I think it's also going to make sense to show the organization name so let's do that and refresh did I do that right go because of Heroku was didn't load that thing I'm not really sure oh I'm looking at services back add it to the wrong thing no wonder wrong spot okay try again [Music] so we this by doing this we should now get not only the services there but also the organization organization name and I think this will be useful for the administrator to help give him context of what was this for again or was that this one you know cuz he might end up using service names that are very similar across different organizations like different kinds of shelters or whatever and that's just going to be useful to list them both okay so we've got that piece of data and I want to go back to this page and do a refresh on it now we have a service to look at hopefully it should pop up here great it does and yeah cool it's looking very close to how I how it was presented I want to modify some things about it there were some changes I made to the design to make things consistent and uniform you know everybody on them on my team was kind of rushing through stuff so I think that applies even to the design some so there's a bit of there's some lacking pixel perfect precision here most noteworthy to my eye is like you can see the the gap here this is a margin for or padding for and this is clearly more than that and so I think what that does is it it adds an inconsistency to the look and feel and so I want to adjust those things so that we give that some more space and then you can see how like I'm just I don't know if this is slightly compulsive of me but I'm just like using my eye down the list here and you can see that none not one of those three things lines up and so that's that's the the last bit I want to do to polish up the the template and then we'll move on to the next thing so to do that we'll inspect the element that's going to be the easiest way to find this stuff and figure out where what is actually triggering it to behave like that so there's a bunch of things going on here so we've got a a div that's wrapping some stuff that she put in that is width full and it's got a padding six here so I think we need to change that padding six to be a padding for we're going to come into this page and find P six oh there it is right there I'll change it to a P 4 still not gonna fully solve the problem because there were some additional padding I believe even on the elements on more nested elements so if we look at this now we've got the outside container that purple box is showing the padding around this whole div and then as we dig in you can see you doing here there's a where that's coming from why that what not clear to me is how to highlight this because I've got my mouse on the stuff that's let me toggle between these two but I'll try and highlighted it with the cursor so there's a small gap that I'm observing that's between now the padding four comes out here and then there's this tiny gap on the actual border that is not going the rest away you know what it could be I bet so this is using a border top I wonder if is a the left and right border yeah let's let's play with this theory so she added border top eight in order to make that teal bar up here so let's try border not top but left eight and border right eight and I'm not gonna keep these in here this is mostly just trying to figure out like what is causing that difference between this the sizing here and and here I suspect no I'm wrong okay so there's some some extra padding but I don't understand or maybe it's margin I'm gonna do is gonna you all might see my screen normally but I have flux on so everything's orange to me so perhaps this is showing yellow and I just haven't yeah that's what it was flux was hiding all of my yellow so I couldn't actually see if there's margin on there and there it is now that I can see there's margin it must be this mx2 okay lesson learned when working with dev tools at night turn off flux of course now it's like burning my eyes but I'll deal you and there we go okay so for me personally I feel like this just adds a symmetry - this is like now we have this line lining up with this line and I don't know let's check on this thing - yeah there's no padding or margin on this so all three of these things are lining up and that level of pixel precision I don't know I just like it but maybe you've maybe you think I'm wasting my time over insignificant details which is totally fair okay what should we do with the rest of this I think we need to test and make sure this stuff works so we're going to show you how I've been testing this this is something that's really cool as well because yeah it's it's great to test in a browser for a while but you really miss out on the little details that come up when you're actually on a phone so the way to test this or a way to test with this which i think is really good is to use a tool called end rock crock and in programming speak is like to understand something you grok a subject I don't know the origin of it but but that's what it is and the end part of this term I believe is network so what I'm going to say is end Rock HTTP 5000 and what that's going to do is I've got my local web server here and it's at its serving at port 5000 it's broadcasting over not just localhost but the whole broadcast space here and I can tell n Rock to find whatever is at for 5,000 and essentially tunnel that to the Internet so by starting this up I've now got a URL to to work from and well geez how am I gonna do this what's in my email so I'm gonna make this private for just a minute I apologize I'm gonna go into my email and put it on my phone and I'm just gonna paste the link to myself there's probably a better way to share links with yourself to get it to your your mobile device but I don't know what it is off top my head and so once I do this and create some stuff over here so I just sent myself an email of the link from end Rock and now I'm bringing up my own phone here and I'm going to click on this and it brings up it connects through that tunnel through and Gronk I should be able to switch back to oh no but got my mail open so what I'm seeing on my phone here is exactly what you're seeing up here well not exactly because I'm on the index page but if I click through now I'm seeing I don't this is probably gonna come out horribly but now I'm seeing exactly what's on the browser and the purpose of coming through here is I'm gonna click from my browser on each of these links to make sure they're working there's probably there's certainly ways that you could do automated testing but this is a hackathon this is like a best effort to make sure it's doing that I just clicked the the mail link and it took me to the right spot so that's good the operating hours this time one doesn't do anything so I can click it but doesn't go anywhere that's fine it's just adding symmetry to the rest of the thing I clicked the dialer and it brought up the right phone number so that's cool I'm clicking the email address and it brought up my Gmail client with a compose email message so that's good whoops oh shoot and then I'm hitting the rate limit of n rock so I clicked too fast but this last one is just a hyperlink so I'll click it here probably good enough what did it do ooh maybe it failed so I didn't even check that out and while I'm waiting so end rock if you have too many clicks unless you're like a paid member will throttle you which I don't blame them I know you know they're offering a pretty cool service and Here I am using it for free so I'm not gonna hold that against them but something didn't work correctly and it was the website here it is so I had called it in the model as website but I hadn't added that by the time the designer was working on this so she added something herself and chose a different name so that was gonna be broken and this perfectly illustrates why you test the stuff out I'm gonna see if I've gotten over the rate limit and we're going to come back to the bottom and now I'm going to click the link and cool it's going going to where it's supposed to go to a city of Frederick page great okay so I think that gets us to the completion of the template and going through it I mean the template itself is is a server-side render template there's not it's not very exciting but I'll walk you through a little bit um I am punting on the entire JavaScript stack so somebody who's a longtime JavaScript person might look at this and be like that is disgusting what you just did I added a script block to a random template on a site but you got to remember a couple things you gotta remember this is a hackathon and so it's not always optimal and even if it wasn't a hackathon like if I didn't need a lot of JavaScript this thing does the job it's just a little function that's being added to the Dom to do whatever you need to do it takes a couple of parameters and that's it and then it does this stuff and the reason the whole reason that it exists is if you're on iOS the way to get to the Maps application is by using this special thing that Apple has with a Maps : as a prefix whereas if you're on other operating systems we just want to standard URL and Android will detect that you're going to Maps and say do you want to navigate in the Knapp's app so it works that way so this little bit of JavaScript gets added here and then later on I call I do an on click call I jumped straight to where it's being used and you can see this is where it gets a little gnarly and people might kind of up their nose at what I'm doing here but that's okay I'm okay with that so any unclick I am calling that function that I defined above and I'm taking the server-side data and plopping it in as the parameters so it's like a pre pre-selected thing with the right latitude and longitude if it's available and so it just does the correct thing so that's the the chunk of JavaScript code here and you know I I do agree that it could probably be better placed in a different kind of block tag I put it in this main block tag just because it was easy it might be better served in something that is added as a block to the head on the base template but I didn't set that up and it wasn't worth it because it's the only chunk on JavaScript that's going to exist on the whole site of all three pages we've got the the main section at the top that declares what kind of category this is and then we're going to loop over each of the services and you've seen most this design though so there's like the the part that you want to read about that's up at the top here and then there's all of the actions that are below and because we've made each of these actions be optional they're wrapped in if statements if excuse me if clauses so that we don't display the buttons if the the site administrator the the director for this organization doesn't have that information we have examples of local stuff where the organization doesn't use ml so there's no email address to give and it would be silly if there was an email button with then no field to actually email somebody so that's the entire template a bunch of optional pieces a bunch of display data looping over some stuff even with some JavaScript thrown in and I think that's kind of cool I think there especially if you're getting into a new project hold off my recommendation is hold off on adding new languages and new technologies for as long as you can so I could have fallen down a rabbit hole of saying you know what I need some JavaScript code therefore I need a JavaScript framework and okay now I need to add view j/s or react or whatever and then start installing JavaScript packages and you know doing NPM stuff and you can do that I bet and that's fine but if if you just need a sprinkle of JavaScript just maybe sometimes just use the sprinkle of JavaScript mm okay that's all I'm saying that so let's kill this we've got the web server done and let's do a quick review of what we added before we move on so I'm gonna add all this to my kit stage and then we'll look at the diff so we change the admin to add the organization name we added the missing field of organization name on the model and there it is on the models again and there it is on the factory again and the test so it's a lot of repetition there and then the last bit is changing the template to use the new design and we tested it out with n rock which I guess I can I don't need that running anymore I'm going to shut it down I also shut down the local server so it wouldn't have worked anyway and we found and through that process I found that one of these things didn't work so hooray for testing okay so coming over to the side we've got these files and we're going to commit them and say add new design for service category page you okay let's do a quick win and then move on to the feed thing which is totally new for me the original design had two clicks the design had something where you'd click a category and the category would display the name at the top and list down a brief description of each service just the the name of it and a truncated version of the description and then it would have a link that said read more the read more link would bring up another page that would list out all the information you just saw but it would do it on just a single page so one page would have one entry pretty minimal the the designer and I think she made the right call here said look there aren't enough services within the city of Frederick to merit needing to split that out let's just put them all on one page for single category and people can scroll and I think that's that's probably the right decision what that leaves us with is an extra view that we don't need anymore so if we go to the core URLs file there's the index view that we saw that's the top-level page there is the category itself which is the page that all the services that we just finished and then there's the actual service detail page which is just bringing up details about an individual service this page is not needed so what I'm going to do is delete it from the urls file i'm going to come to the views and delete the view itself it was only a couple lines and then we're going to go to the core test views area and delete the one test okay and there's one more bit to clean this out fully and that's the template so there's a core template whoops got that backwards template core we've got the service detail page so this is the the old version and it's it's pretty similar to what you just saw but it's not as pretty cuz I'm not a designer I wrote this initial version but we don't need it anymore so we can then now delete this page okay and then as a sanity check to make sure I didn't delete all the wrong stuff I'm gonna look at the site again just quickly I just refreshed all my chat that's okay there wasn't a big discussion there [Music] you great it's loading up images that on localhost' sometimes it takes a while to load damages they're not big image files by any means okay the two main pages that we care about or I guess about three pages that we care about are all working so that's good and I can also run the test suite to prove that all the tests still pass okay so well do whoops here's that what we deleted we delete but test the URL the view and the template and we'll say remove unused service detail page that's what we're doing okay now it's to time to explore the great unknown for me I saw this feature in Django and I read some of it I didn't read a ton of it but it's on generating feeds and there are some tools that are in there but I don't know how much we have to supply to make a valid feed that will be useful to to the service so I'm going to do is I'm going to bring up the Django RSS feed documentation and I guess this is called the syndication feed framework so I don't know if we have to add I'm trying to look through here to see if we have to add an app before this will work it might just be content that we can import and get going but as a reminder that the goal here is to make so we're going to make an RSS feed for the announcements and the reason is to to connect the data to MailChimp to automatically send out announcements again this is a functionality of MailChimp that if you have an RSS feed it can automatically send email if it detects something new and so if we can get the RSS working then and and this project is selected as the winner and we actually hook it up for this organization then we provide a really good path for minimizing the amount of work that the administrator has to do okay so let's read some Docs and then we'll try and put together the proper feed I already don't like these dogs but you should okay this is a I love the django community I'm gonna be a little critical of the Django community right here shouldn't have to say all you have to do for some people writing a Python class is really intimidating I think this could be phrased in a way that is not so trivializing but anyway that's just commentary aside we have to write a Python class that's all we have to do we'll see how hard that is we need to add the feed and point to an instance of it on our URL Kampf yes represents a feed cool feed classes subclass they can live anywhere in your code base okay so let's make for that then this is an announcement or this is associated with announcements so that we have an announcements app and I am specifically not gonna put it in a views file it's not a view in a in the literal sense maybe internally the feed model or that feed class does boil down to a view I didn't check it but I'm not going to treat it as a view doesn't seem like the right thing to do so we will go up and create a file called feeds you and what else should we do here maybe we could do some test-driven development on this that might be fun so let's create a let's go to the test views area and do a split on that for the moment oops wrong direction I want to do a vertical a split this way horizontal split and we'll go up a directory and create a new file and we'll call it test feeds that by all right and we're going to do import from test Plus import the test case class and in a lot of ways this is going to behave like a view because at at the end of this what's still happening is something it's going to happen to be a computer in this case but a user could do this too could go to a URL which I'll probably call announcements feed and get the content which an RSS feed is some XML content and it should contain announcement data so we have announcement factory that we can use and we have we have tools to check on user like a client and do a get request so this could be a pretty straightforward test case to do of adding a class that is a test and I'll probably end up calling this thing the announcement feed and so I'm gonna name it with a test case that's similar and we want to check pretty much just a 200 kind of condition so we'll give it a test okay scenario we're going to need an announcement and that's going to come from the announcements factory and in order to get access to that we'll do from dot factories import announcement factory okay and then we're going to do a what we're gonna do we're gonna do a get on the view on the URL this would be a self get on announcements which is the app app name where all the URLs are defined the app namespace or whatever it's called and then the the thing that we have not created yet is going to be called feed so that's what we want to do the get request on and then the final thing that we want to do is I want to assert a couple things I want to assert that the title of the announcement is in there somewhere and that the description of the announcement isn't there somewhere I don't know what feels those will correspond to in the feed but I want to make sure they're both present so let's go over to test Plus and there is a way to check content where are you check contains that's what we want so I want to say self assert response teens and stuff that goes into that assertion is the text that we want to check for the announcement I believe I called it a title we'll check on that in a second I don't remember what the Mitel model called it and we need the response itself and in order to get the response that comes back from self get on the test plus test case okay so we've got title and we've got I think the other one is description all right let's see how we did oh I put that in the wrong file Josh shoot okay we'll fix that in just a minute the title and description is right oh there's another test that we're going to need on that feed I put this in the totally wrong area though this is there's an announcements app so all of this stuff all of this code should go into announcements test file which I have a test feeds over here paste all that stuff and then go back to the core one and delete it over here because that's not going to be right and that was gonna fail because the announcement factory is in the announcements app so it would have just failed even on the import I expect this right now to totally fail as well because there is no announcements feed yet just going to complain about well just going to give a four hundred here but if you dug into it and saw the debug content it's going to say I don't I don't know what you're talking about okay next we need to go to got that announcements feeds file that we're not using yet let's go to the URLs area and the name of this thing it is going to be it's going to be a path to what's call it feed and we'll say feeds announcement feed and here is where I don't know if this is supposed to be an instance or what we need to go read more of the documentation to see what that's supposed to ultimately look like and we need to import these from the local django app okay let's return to the documentation see what this looks like they've got an example here where they're defining a feed cool and a path cool no problem and then they they just instantiate it okay so this is the right structure here like that but this is gonna fail because that announcements feed doesn't exist right I'm gonna let this like on a try error driven development that I mentioned last couple streams and I'm gonna create a feed that doesn't do anything except for subclass from the appropriate feed class that Django's has to come from and my hope is if I keep running this test we're gonna go until this this all works we have the URL wired whoops we have the URL wired appropriately and we're down to making the feed class do what we want it to do and yeah I think that's that's going to be a critical element and it's also asserting that it's going to contain the title and it's going to contain the description so those things are present and the feed class itself is producing valid RSS data I think we win okay so let's go I think the URLs file is done let's go back to the feeds area and import the thing that it says to import which is this got a feed and now we're going to take a class of announcement feed and going to subclass from feed and let's give this a good doc string instead of just a pass say generate an RSS feed that chimp or any bead reader can import set the use case that we're going for and coming back to here who Wow this'll be fun getting into so this is telling me so the the django views system if you are using generic views they are really good about saying well they're not super good like they could be better they could always be better but they're pretty good about saying you didn't do this you didn't configure this right it's it's pretty clear to me that the feed system does not have that level of checking on people probably because it's a corner of Django that is not used nearly as much so we've got to figure out what these errors are saying so first thing to note is it's saying the URL so URL is none and I know that starts with is a string method so we're missing some kind of URL so maybe rather than guess though we should look at what it says what the documentation says you have to include before we dive too deep into the errors because we don't really know what we're doing sounds like I don't know if there needs to be a title the other thing that we can do at the end of this process is inspect the full content of what the fiie generates from the test and see what it looks like and see if it matches up with what we expect okay so it looks like we need minimally a title a link and a description this kind of thing right here I don't like doing this I don't know why this is here in this way Django system tells you repeatedly to try and use stuff like reverse when you're in Python code so that if you have removed something around you can get to the right link to something so having a class level attribute because you can't run reverse right here that's not going to I'm pretty sure that doesn't work because Django at modulo time Django has not loaded all the apps so it can't reliably do reverse and if you tried to do a reverse there I think it'll give you some error like apps not ready or something like that that is something that happens when you do something too early before the rest of the Django system is is essentially booted and ready to go okay so we have items this is essentially looks like the equivalent of a query set that we have to provide that is going to be what it's reading from and then it's looking for a title and description from our items so that's that's pretty cool and we also need an item link okay we can supply that though and okay so now they're giving us more information title link and description those three class level attributes correspond to standard title link and description elements respectively is there other way from a function or method matters because MailChimp is probably not gonna care it's just it's going to be most interested in ya individual items that are in there I think but I know we'll get to more of the details let's let's see if we can get the basics passing even if it's non optimal and if it does then we can explore making the RSS feed better so let's say the title is call it announcements from ship and then the link I don't know well there is an announcements page so that's probably the best fit this and description well you can put it from the description announcements for [Music] homeless in Frederick County Maryland okay test now I'm curious so we still haven't provide items yet so it's still not happy there and so let's do that we need to create the items method is gonna be self and how do we want what do we want to return we'll probably need to write some better tests like the the test that we have is just testing that one is there but I don't want the feed to be just every announcement ever because over time like in theory this organization could be using this for years if it's selected it could be using it for a long time because they might they might just be happy with it there's a lot of organizations especially nonprofits which is what this one is that if they get some code they'll just let it run as long as they can that does have some downsides if you're not dealing with like security properly but we can we can be pretty responsible about about that so it looks like this items thing can take a query set so that's that's good so we're going to say announcement objects and let's order by well do we even need that because I might have added an ordering on the announcements model I added ordering on the expiration date so we don't even need an explicit order by so let's say all but then let's do a slice and a slice of the last five and then we need to add the import to the model so we're gonna come to here and say dot models import announcement okay so what does that do the the dot model is the path relative is relative import syntax if you've never seen it before so it says look in the current directory the current packaged directory find the models module and then get the announcement class that is in there that's what that's all about the announcement is the model and we're doing using the manager from the model and we're saying all of them but only give me the last five and so if you do if you look at this this is gonna return a query set and if you look at the query on the query set there will be a limit five in the generated SQL so this the statement that's actually going to the database is only going to pull the latest five the other thing that comes into play here is that I've added this ordering on the expires app so it's only going to it's not only going to just pull the last five but it's also for every query going to give and ordering on on them so it should only ever be pulling the latest five announcements that are last to expire I mean in other words the newest five announcements to consider we could probably see that if we take this and say this is going to be a query set and we can print should be able to print the query set query just to kind of prove prove it out probably going to get some failures because we haven't added items title or URL yet and hopefully somewhere in here will be our actual query but I'm not seeing it there it is okay so it's a select statement and there's an order by on expires at as I said and I said descending order because that's what the the negative on there is for and there's the limit of five because we're doing a slice so it's doing exactly the query that we expect we'll write some test for that in a minute but let's delete this chunk because we don't need any of that extra stuff so we're gonna have a be returned and I'm satisfied with what that items is gonna be returning the other bit that it said is it needs to get from the list of items it needs to get the item title and it's going to receive an item here so I imagine that the flow of this is that the feed does the the call to the items method gets the query set and starts to loop over them and as its building the RSS feed it knows it needs to put in a title for each item in the RSS so it takes the item of whatever model that is and pumps it in to this item title record or excuse me item title method and that method produces a title in some fashion and then the returned value is what's actually going into the feed we have a frankly a one-for-one mapping here so this is actually about as clear cut and dry as this can be of having an item title like this match up exactly with the item title of the announcement itself so that's that value then we need the item description again these things are named in perfect perfect synchronicity I guess is the right word so it's going to return the description from the announcement and that should be all the details there and then finally it wants a URL and so the URLs as I said we deleted the we don't have a specific page just for announcements so I can't do an announcement detail page but what I can do is the announcements page with a an anchor tag or an anchor what do they call fragment whatever there's a terminology for when you have the the octave or the pound sign in the URL to point to something else we can we can point to the right thing there so the final bit is I call it item link def item link it's going to take the item and it's going to return mm-hmm I need a reverse so hold on one second from Django URLs import reverse and we're going to do a reverse on announcements list then what will tack on to this is the fragment that I was talking about so that would be F of Ashe announcement and then item pk and this is very specific to this application in this template like if I go bring up the announcements template you can see the section that is defined in to know why that is all linked together so here we are we're looping over the announcements and you can see we've got an identifier here of announcement - ID I guess I could instead of PK I could do ID to make that clearer so what that'll do is because the hash is that it on there when the page loads it will try and find the HTML element marked by that ID and jump straight to that so it's the click that's the closest thing that we have to linking directly to a specific announcement okay and we lost our test let's bring the test file back up so we've added the three minimal elements hmm responses content is not valid HTML okay let's change this I think there's a there's a flag here if I recall you can say hTML is false I think what it's trying to do is parse it and be smarter about it Moo interesting now we're getting for well that doesn't seem right but I did something wrong along the way let's go back to Tess plus and make sure I understand that HTML parameters doing because I don't and I think I did it wrong oh I know that doesn't go there it goes on it was on here goes on the response contains so let's do HTML of pulse on those now it should hopefully treat it as raw content great it did um okay let's let's see what that content is this is what I'm super curious to see so we're going to print out the response content and I'm adding the assert false here because if you don't if I let's let's let me actually show you I've got a print and I want to see the content but if I run the test the test passes and in pine tests within test passes it's not going to show you anything else it's like you're you're done it's it's for everything's working so but if you add in some kind of assertion to make the test fail on purpose and the easiest one to do that is assert false then what it does is try and gives you the extra diagnostic information so you can see the extra content and now we've got what's actually in in everything and here's the content of the feed the hat looks like complete rubbish to read though so maybe this is not the best place to see it so we've got the test passing which is great let's go take a look at it because now we should be able to access it from announcements feed which is where it should live so we'll come back to the ship website no we don't need my email come on and we'll go to announcements and I'm gonna tack on feed at the end oh hello well that's odd so I don't know what it's doing here so I feel like that should be returning a response type that is type XML it's kind of weird that it's giving a plaintext type let me see what we can see from the network tab of what happened you okay let's cancel that and then inspect this okay it is saying the type is is in XR SS XML so I don't know I don't know when Firefox started doing that I thought it would display the XML in browser but clearly doesn't do that anymore maybe we can try in Chrome maybe Chrome Oh behave a little better not better just in a way that we actually can actually inspect it here so I'm gonna bring up chrome so you all can see it well resize it a little bit and then try to put in the feed okay that's not any better but at least you can it's still the content but to me this looks like a valid feed it's a declaring the XML type at the top it's declaring that it's an RSS and giving the namespace of where the parser can figure that out and the details of the rest of this look like stuffing what you'd see in a feed here's the title that we added here's the link which is including the domain and the URL so that'll when it finally lives in its final site that all I connect it to the right thing there's the description of everything in there and then we get into the details of each individual link including like times and all of that stuff and the content etc etc um and there are a couple of items in my feet in my local database so that's actually what we're seeing so we're seeing two separate items this is a different one cool I think that's enough to prove that it's working so there's probably I want to add two more tests I want to make sure that that if we I want to make sure that the limiting is right that if we make five announcements then the sixth one won't appear and what else should we test you that's good enough want one more test and then I'll then we'll be done and then I'll deploy it and share with my team which is awesome hmm all right back to the code stop the browser or the web server and they test limit items and well as a test docstring will say a limited number of items is in the feed I happen to know that the limit is five so if we do for I in range you have to give range the starting number I don't remember well try it without rent and see if that works I can't I can't recall if any is a starting range and we'll say announcement factory okay so the important thing is to make sure we get the oldest one so if these are executing in time these are programmed to the announcement factory's programmed to take a timestamp from I say from each time each time you call it it will take the time zone now time stamp and it's adding on a time Delta to make sure it exists in the future so the five if we want the five latest then we need to put an announcement before if we're trying to verify that that one is not there so this one should be the oldest one we could even go further and say let's let's in fact let's do that let's go from Django utils import time zone and we also want to import date time and we'll explicitly make an announcement that exists like in the past so it it is definitely going to be behind these other five will say expires at is a time zone dot now - date time time Delta of a day so this is just trying to make some some data that's definitely old in this system and then we will call the same thing and I want I think we just need a single assertion that are you know in fact to make this even more clear because there's a there's a very slim chance that the the titles between factory generated data could be the same so we'll we'll give it an explicit title that we're going to look for and we'll say that it is not going to be there and we can check that not going to be there is who we don't want our response contains because this this will fail because it said saying couldn't find it not surprising that was exactly what I wanted to try and check so we can't use a cert response contains instead we're going to assert that not going to be there is not not in response content I'm decode why am i decoding well first let me see if it's passing let's see if it fails without the D code and it will because I think we're comparing the wrong types yeah Django response content that goes out on the web server goes out as bytes so in order to like if you have special characters like accented characters things that are not in standard English which is super common all over the world then that data is taken from its Unicode format which is you know when it would appear something you'd want to read as an accented character and it is encoded changed from its Unicode representation into a byte representation you're turning it into code bytes code okay so that's what a response content is to do the verification properly Python 3 is a lot more picky and maybe that's not the right word specific about what you have to compare so what's happening here is the string that I'm testing not going to be there python 3 a string is Unicode so that's Unicode so we're comparing trying to compare Unicode characters which is consider data that has been decoded and has the proper representation against raw bytes and Python 3 says no you can't do that anymore we need to actually compare the real thing so you in order to do a proper comparison we run decode on it and that's gonna pass it through I think the defaulting decoding is utf-8 so it'll take it it assumes that the content is encoded into utf-8 as the the byte format and it's going to decode that change that encoding and put the stuff into a string of Unicode so now that by the doing decode what we're left with is an apples-to-apples comparison of data types it took me a really long time to wrap my head around Unicode and encoding and decoding so if that doesn't make sense you I don't blame you but if it did great so now hopefully the test passes and if what if we say what if we print response content decode just a see what's in there and take up a not should fail and here's all the content so this kind of just gives us the confidence that there are a bunch of items in the the RSS feed just not the one that we expect to be missing that's good and in fact we can see it here because the database is getting wiped between each test so when new records are created they're given the the PK values the the primary key values the IDS are starting over again so our first one is gonna have ID 1 and if you're looking at this RSS feed and checking out the links remember we built the link from the ID and so the the newest one that's in here is is one with ID 6 and the oldest one that shows up at the end is ID 2 and the one that's missing is ID 1 which is the one we expect so we'll do that and test passes both the test should pass and that's pretty cool I'm still not super thrilled that we have to hard code in the link here the there's perhaps a way you know I'm gonna spend like the 1 minute to check if there's a way to get this link not from a class attribute but rather from a method if there's not then fine at least I'll have done my due diligence and checked on it so let's go into the code this is in the syndication framework so let's go to Jango check the master and we'll go to we'll go down to syndication and this was in reviews you that's interesting you can learn all sorts of stuff here get absolutely URL if you haven't defined I'm looking specifically for link so let's keep jumping get dynamic attribute link from object oh oh okay I wonder if we could get away with making this a property but that would work yeah let's try that so instead of using a class attribute let's change this to a property will say link and then we'll do a reverse on announcements feet and ditch this I'm going to comment it out for now just and run the test yeah cool um okay I still want to see it no no that's probably paranoid of me but okay I'll be okay being paranoid so let's do content and then delete that and link is announcements feeds feed oh that's not what I wanted I was using announcement list instead nope wrong spot so you can tell it's getting late making all sorts of silly mistakes at this point okay try the test again Oh why did you do that you that's like rendering the page what though what's going on there you oh I saved it with the list all right there it is finish it off it's got the proper link correctly from a reverse rather than from the class attribute so I'm happy you okay and then check the whole suite the test pass and let's check well I just made some changes see we've got we created a new feed it's got a title a description and a link the link is properly coming from Reverse we get the last five items the ordering comes into play so we're making sure that is ordered by expires that is just coming by default we define how it gets the title the description and the link for each of those announcements and we have a couple of tests on it and the URL super will say add since RSS feed push that up and just to show off the final a little bit here's how you can do a Heroku deploy this is what I like about Oroku you hook up a remote i/o do a git remote - V you can see the source codes living on github at this origin but we also add this Heroku remote and it's the remote to that shrouded temple URL that I gave you earlier and if the way to do a deploy is by doing a git push to that remote to the master branch there and as soon as you do that Heroku is showing back information of what it's building and it's putting together it's putting together your application it's taking the code trying to install all the packages in there it's trying to do as much as they can from the cache it's in this case it's detecting that it's a django application so it's running collect static to get the static files and it does discovery of what's in your proc file here so it knows to run a release command it knows that how to run the web and you can see in my final app when it was all built was 56 megabytes in total it runs the release command which does migration and you can see that the migration ran to add the organization name that was missing and then that's it and now if I go and bring up the shrouded I bring up the admin of the site we're now looking at a shrouded temple here which is the where this thing is living and we look at services go to add a service then we've got the organization name that new name that we were requiring so all this is done the site has all the stuff we can go well there's no there is an announcement on here if there's one announcement so we could look at well actually we won't be able to because Firefox is going to prompt us download it but this should not fail at least not with a 404 so we're getting a file that contains the feed so that's good and everything's there what's left on this before the presentation tomorrow is to populate some some fake services to show off that's that's all that's there and then it's kind of up to the organization decide if they they want this I think it's a pretty compelling application I think it I find I find that it be pretty pretty neat it was a fun Prepon project to put together in a couple of weeks and there is a little bit more work to do if we're gonna do this like as I said the the MailChimp stuff they actual sign up we made the RSS feed available but the minute that sign up itself is not there so we need to drop in a form so that someone could actually provide their email address to sign up that's one one thing that needs to be done and then if this organization wants to do this we have to actually do the the connection between this Heroku application and the the URL the domain from this group and so the plan is that what we pitched to the director is it would live at something like it would live at a subdomain something like Haven that ship Fredrik comm and that would give a pretty pretty clear place that's very separate from their main WordPress app so that doesn't step on the toes of anybody it's a totally separate thing and then we've talked about doing some other things too that you know as as simple as this is people are not going to remember that ship Frederick is a homeless thing let alone that Haven ship Frederick com exists so we've talked about buying a local domain that that we could use to as a as a marketing tool we have a have a realtor on my team and he's very accustomed to doing this for if you ever seen people trying to sell houses where they buy like some domain just to get your attention on a house like this is his thing so he's right in his wheelhouse and we might do something exactly like that that would do a redirect that would get people something memorable that they can get to the site and then show up at the proper location I think what I'm most pleased about all this stuff is that we made a responsive mobile web application it's functional you can click around and it brings up things that you're used to in your your mobile app your dialers your Maps your all this stuff has connections right to the things that you expect the other thing that I didn't even show off is we added the add to homescreen feature so if people want to get to this without punching it in going from specifically from a Chrome browser to the URL and want a quick access that does a full screen experience of all of this that's in there too and and so I think I think it's all come together quite nicely I have been going on for a very long time I'm looking at my clock here and it's something coming on two hours so I think that's we're gonna leave off for the night hopefully you enjoyed seeing building an app for a hackathon the something that came together this is this is the kind of work that takes to get three pages onto the Internet but at a quality level that I think is that will make people in our community happening so as a reminder to you if you're in your community and you have the opportunity to be part of a hackathon and find some way to contribute back maybe it's not even a hackathon maybe there's other things that you can do I would HIGHLY encourage that there's a it's a good opportunity to meet folks in your town and do something that your community can value thanks Mike thanks for tuning in you were here for a long time so hopefully you found that valuable with that I'm going to sign off I will take the content fruits I having a little trouble understanding your your question here is a program I can recommend that improved my work or life can you expand on that a little bit and I'm having to try and answer but I guess I'm I'm got late late streaming brain and my ability to process questions might be a little diminished if your question is like where can you find stuff that that improve that that helps your community I think it kind of depends on where you live you know there's there's a lot of city services that you might have if you're in a small city that ways you can get involved contact local IT departments a lot of our stuff so this this in particular hackathon is sponsored by do I have a link I do so there's a group in Frederick where I live called Tech Frederick and it's a kind of a hub for where technology companies in my city can come together what pc probe oh oh oh oh I'm sorry I I think I'm getting your question a little bit better now why do I good productivity booster you Pomodoro that's my answer Pomodoro and I don't use it on a PC but I have a Pomodoro app and I'm on it this is a this is an Android phone it's a pixel too and I have a little app here I'll do a plug for them because there I found it to be a useful little app it is called once they called focus to do something like that and I was really skeptical about using the Pomodoro Technique I don't know if you're familiar with it but the idea behind a Pomodoro is you set a timer for 25 minutes and during that 25 minute period you work on whatever the topic is for that one thing so I think I said earlier in the stream that I have a should have a big article coming out tomorrow I've got a tracking on it so it's an article about Django models and and then this is way too small for any of you to read but it says I've done 27 Pomodoro's to write this article it's it's very lengthy but during during each of those Pomodoro's the ideas like you focused all your attention on that specific thing no checking Twitter no checking Facebook instrument whatever your your guilty pleasure is for distracting yourself you commit to working for that 25 minutes on that thing and for me personally using this as a tool to aid on my side projects it helps immensely to get get just some really focused time on something and you'll be surprised at what you can crank out in 25 minutes and if you keep going you can you know if you have the once you get you what I find is once I get one of those going and I'm getting in a groove I just kind of crank on to the next one because I've gotten in that groove and it's like alright I'm all my focus is here I'm just gonna keep going so that's that's what I find is my biggest productivity booster in terms of actual tooling there's all sorts of stuff that people use that I don't find a lot of value in simply because I'm not tempted in some of those the waves oh you're welcome for instance like I know there are people that have like a really hard time like checking something like Twitter and they do it like compulsively and there are programs that will like let you block entire domains on your computer and lock you out I I think I used to be that way sort of years ago but haven't really felt them much need for that kind of tool in that time so that's what I find most useful anyway wrapping up the stream I'm gonna take this content and I will put it up on YouTube so if you want to refer back to something I did that was either good bad or ugly you're welcome to do that and thank you all for tuning in and I'll see you next week hopefully take care

Channel: Matt Layman

Views: 458

Rating: 5 out of 5

Keywords: twitch, Python, Django, SaaS, hackathon

Id: zVERQ1aCbvs

Length: 112min 30sec (6750 seconds)

Published: Fri Jun 26 2020