Category Archives: Ate Here

Progress with My “Places to Eat” Web Application

Posted on by

Over five years ago, I blogged about starting my “Places to Eat” web application. Then about the “Places to Eat” application’s progress. I still work on it now and again, mostly adding new restaurants or city/states. You can find my list of restaurants at Gotta Eat Here.

Since then, I have been playing around with the accessibility and usability of the application. I did this to make sure the restaurant information worked for everyone.

Leftover cheeses, cured meats, and even a few veggies on a cutting board in my living room.

The above photo was an excellent snack that I had while starting the research of iOS applications related to finding a place to eat, drink, attend an event, etc.

I still haven’t completed all the research on other applications that you can store places to eat. I need to do the research again and see how the applications have changed when I start over two years ago on this post.

But I have asked people I know or meet at conferences if and how they keep track of where they want to eat when traveling. I have used their feedback in my process to build something easy to use. Along with getting them the restaurant information quickly and easily.

10k Apart Contest

Years ago, An Event Apart and Microsoft put on a contest to build a web-based application in under 10 Kb. It was called 10K Apart. The contest was an easy way to code a light-weight mini-application to display all the places I liked. I have gotten other recommendations from people I know in a given city, or from blog posts/articles, or TV shows.

The plan was to build the main HTML and CSS template in three to four kilobytes. So I had six or seven kilobytes for the content. I used PHP to read in JSON files for each city that contained all the restaurant’s information.

I spent about eight or ten hours building the responsive template. The beautiful thing is there was no primary navigation, so I didn’t have to worry about that. I simply created a drop-down list of cities and states that you could choose. Then people could find out where I recommend they eat n those locations.

10K Apart Entry

The 10K Apart version was only ten restaurants per city, so when the page rendered, it was under 10 kilobytes. I wasn’t sure if the 10K Apart contest would count each page towards the total kilobyte count.

So I built the PHP code to refresh the page with the content back to itself with a full-page reload. At first, I used POST for the form, which hid the location information from the URL. Later on, I changed it to a GET. So I could send people a link that had a city parameter ( slct ) in it to save them having to look things up themselves.

After the 10K Apart Contest

I used the 10K Apart contest entry as my starting point for a much larger version. I built a more comprehensive individual city and state JSON files of places I ate or wanted to eat. I started it to have an easily accessible list for myself, or if people wanted recommendations, I could send them a link.

Since the contest ended, I have added more restaurants, cities, states, etc., that I forgot about previously. Or new places I have tried and would recommend to others since then.

Over time I have even removed a few restaurants because the last few times I went, the food was not as good as it used to be. I have also removed places that have closed. I have removed more spots during the pandemic than at any other time.

With over 75 cities/states and close to 1,000 restaurants. It’s not an easy task to check broken/redirected links. So every few months, I check each city or state using the W3c’s Link Checker. Short blog post to come on how I do that.

This reminds me that during the pandemic, I should do it more often.

Future Plans

Long term, the plan is to start posting every two weeks or so. A handful of places I recommend you should eat at in a given location or for a type of cuisine. I think a newsletter would be a reliable way to do it too. But first, I need to look into newsletters, etc. I did create a MailChimp one that I haven’t used yet that I need to find again.

I’m doing this, so I will have a shortlist for a location to share with people in the future. When they ask for recommendations for a city or places I have already been. Along with maybe a bonus place I’m looking forward to going to when it’s safe to travel.

Future Posts

Over time I plan on writing multiple posts for some of the following locations and other locations:

  • Annapolis, MD
  • Austin, TX
  • Baltimore, MD
  • Buffalo, NY
  • Cleveland, PA
  • Las Vegas, NV
  • Memphis, TN
  • Nashville, TN
  • New Orleans, LA
  • New York, NY
  • Northern California
  • Northern Virginia
  • Philadelphia, PA
  • Portland, OR
  • Rochester, NY
  • San Diego, CA
  • Seattle, WA
  • Southern California
  • Syracuse, NY
  • Washington, DC
  • and many more

Conclusion

Please leave any restaurant suggestions in the comments. Along with any cities you are traveling to and want recommendations. If I have any knowledge about the locations, I will work on adding them to my list of over 75 cities or write a post about them if I already have information on them.

It would be helpful if you could please include the restaurant’s name, address (city and state), phone number, link, etc. Doing so will be helpful I’m when looking into them more.

If you want to find out more about places to eat, please register to receive an e-mail/newsletter when they are available.

Playing Around with Flexbox by Starting with Articles and CodePen’s from Others

Posted on by

About a week ago on January 13, 2019, I saw a tweet from Heydon Pickering  ( @heydonworks ) talking about how he was using Flexbox to switch directly between multiple and single column layouts but didn’t have time to read it at the time because I was at work.

Later that day I saw Jonathan Snook ( @snookca ) had tweeted about some tweaks he had made to Heydon’s CodePen example.

Here is Heydon’s “The Flexbox Holy Albatross” article which he didn’t want to use media queries or JavaScript, along with Jonathan’s article about Heydon’s “Understanding the Albatross” article. NOTE: I used media queries to change font sizes in my example.

Started to Play with Heydon’s Code

After reading through both articles, I started playing around with Heydon’s CodePen to see what would happen with only two blocks for my jfciii Ate Here restaurant list. After playing around for a bit, I grabbed the HTML and CSS I had messed with and copied it into Textmate to make one page using my template for jfciii Ate Here. At that point, I gathered a few restaurants from my list of place to eat in Washington, DC and replaced the blocks with real content to see what doing so would be like on the page.

Part of my picking certain restaurants was to gather ones with different lengths to content for the same row for a wide width screen (think desktop/laptop). At first, I started with two per restaurants to see what that looked like for desktop/laptop and different width between there and a narrow width for a phone.

To me, it seemed that having two items to a line/row seemed like it could be confusing when reading the content, But then I remembered that most of the time people would most likely checking for restaurants on their phones while they were out wandering a city or sitting with friends instead of a desktop or laptop.

Pushed My Code Example

After pushing the updates a few different times to my website, I asked a coworker what they thought about the two columns, and they thought maybe adding a bit of space between the two columns would make it easier to read.

I then spent some time working on my CSS to add a few REMs worth to the right of them which seemed to work. But then I had the problem of forgetting I had to only added it to the first item in the list for a widescreen device. I ended up using :nth-child(odd), so the extra padding was on the first item in the row. Next, I had to remove the extra padding when in a narrower view such as on my phone.

Then I decided to attempt to use three restaurants to a row for a few rows and then two for one, and one with only one restaurant to see how they all looked before updating my PHP code to generate a given amount to my application page.

When I did that, I then had to add a max-width to the restaurant content container, so it didn’t span the width of a row, so the reading experience was better for people because of the long line length.

So here is my experiment with a bit of flexbox for jfciii Ate Here and the current look of one restaurant at a time for the wider width.

Thanks, Guys

Thanks, again Heydon and Jonathan for your articles and examples to get me to play around with flexbox.

Further Reading and Video Watching

Now it’s off to spend time finishing up reading Rachel Andrew’s ( @rachelandrew ) book from A Book Apart “The New CSS Layout“. Then start reading Rachel and Jen Simmons ( @jensimmons ) other work and watching both of their amazing videos to understand CSS Grid better. See below for more of their work.

Rachel Andrew

Jen Simmons

Conclusion

Please leave a comment of which number of restaurants per row for wider screens you think works for ease of reading and compare against my current version of jfciii Ate Here.

You Should Use Your Local Public Library to Do Work

Posted on by

You should use your local public library to read, do tech related work, catch up on e-mails, etc. on the weekends or nights after work when others are not around. Over the last year or two, I’ve found working at my local libraries has been easier than working in a coffee shop. It’s also a change of pace from working at home.

Using the library is easy on your budget. Doing this means you don’t have to buy another latte or fancy pastry or sandwich or salad or Gelato so you can get another hour and a half of internet connection. Or so you do not feel guilty that you stayed there for a few hours more without buying anything. Plus, if you’re drinking lots of coffee or tea, you won’t be all hopped up on caffeine by the end of the day. Even though some libraries let you bring in beverages in a fixed lid container. I think the main Columbus library sells drinks on the first floor.

Over the last year or so I have gone to a few of the Alexandria, VA and Washington, DC, libraries. Did this on a few nights and most weekends when I’m home. I spend my time working on improving my list of restaurant’s I want to visit when I travel or even at home application (jfc iii Ate Here). A lot of the time is spent finding the details about a restaurant. Such as their address, phone number, a description of the place and what they serve, and URL. Once, I have that information I put it in a GitHub issue so I can add them to the proper city or state JSON file when I have the time.

I especially like visiting the central libraries in bigger cities when I’m there visiting for work or on vacation. It’s great seeing how grand some of the older libraries are. In the last year or two, I have been to the following cities and their libraries.

Libraries are Listed Alphabetically by City Name

NOTE: Updated list of libraries and URLs on October 9, 2019.

I have found at the smaller libraries, the earlier you get there doing so allows you to locate a power outlet. Be they in, on, or under some tables. Other time you need to find a chair along the windows of the walls for an outlet. To avoid having the problem of lack of power I make sure to charge my laptop the night before. Or in the morning if the library doesn’t open until late morning or early afternoon.

Bringing headphones to help cancel out some of the noise can be useful depending on the library. Sometimes having headphones in or over your ears is enough to cancel out most of the sound so you can think. Doing so gives you that option if that is what you need to do.

No matter the size of the library they now all seem to have wifi so you can get to the internet. With not knowing how good the wifi is or how much content other people are going to be downloading I tend to bring my “Your Karma” mifi. Doing so allows me not have to worry about what others are doing on the internet.

Conclusion

Use your local libraries to get work done, so they continue to get the funding they need and are open for others to use. It beats sitting at home all the time. You might even see people you know or meet some new people.

On hot summer days or cold winters ones too it’s a pleasant place to relax and get out of the weather when you are traveling be it for work or vacation.

Bonus Location to Work

Use your local libraries to get work done, so they continue to get the funding they need and are open for others to use. It beats sitting at home all the time. You might even see people you know or meet some new people.

On hot summer days or cold winters ones too it’s a pleasant place to relax and get out of the weather. When you’re home or traveling be it for work or vacation libraries are a great place to be. Another great place to get some work done is your local auto dealer. I know you’re thinking I’m crazy. But if you can get an appointment on the weekend when they open. You then tell them you are waiting and will be sitting in the salesman’s section out front. Doing this is great if you have your own wifi/mifi. Because the service section has desks and opens an hour or two before the sales people get there. Giving you plenty of time to work quietly. Usually, the only person running around is someone either sweeping or mopping the floor so it looks good for customers buying cars.

Plus, it’s interesting on a Saturday towards the end of the month. Doing so lets you listen to the dealership manager or owner come to talk to the sales team to get them pumped up to sell cars. Along with reminding them they have to sell a certain amount of vehicles to meet quotas and they can get bonuses.

Use your local library to get work done.