After a couple of months of development🥲,the Whinst app is now completed, deployed and ready for use. Whinst is a web application that allows you to create and share digital catalogs of the products and services your business offers. The application has a free version that allows users to create a single catalog and a …
With all these steps completed I can now proudly say the Whinst web app is completed and ready use. Stay tuned for the next article which will be final of the series where I’ll fully reveal the application and how you can access it. Thank you for reading!🙏
With the Whinst web app nearly completed, I’ve spent the past two weeks working on some final tasks before deploying and launching the app. Some of these included:
Changing the application font in a Nextjs application is pretty straight forward as compared to other frameworks. Nextjs comes with a Google fonts package. All I had to do was import the Google font I chose and added the font to the body tag of the main layout file of the application. The code below …
To optimize the performance of a web app that uses images it’s important to keep the size of the images small while also maintaining their quality. In the Whinst web app I used the Nodejs Sharp library to compress jpeg files after saving. I’ll add compression functionality for png files later. Added a simple footer …
As you may have noticed the title of this article is different from the other building Whinst series articles. From now on these articles will be a weekly summary of what I’ve worked on in a particular week rather than articles on specific functionality added. This article is the first one and is the summary …
Because Whinst is a very visual app, I’ve spent quite a bit of time working on it’s design/appearance. This process involved adding different design elements that have contributed to the great UI and UX on the Whinst web app. In this article, I’ll tell you about the different design elements I used. With these crucial …
Building a web app (Whinst) Part 28: Working with different design elements Read More »
In the last article I talked about how I created a UI and UX design plan. One of the things I mentioned I’d work on in the plan was the creation of a responsive navbar. A navbar short for Navigation Bar is bar found usually at the top of the screen on a web application …
Building a web app(Whinst) Part 27: Creating a responsive Navbar Read More »
Now that all essential functionality in the Whinst web app has been added, I’ve started working on the UI(User Interface) and UX(User Experience). But before jumping into this I’ve created a design plan that highlights how everything will look once complete and how I will go about creating it. In this article, I’ll tell you …
Building a web app (Whinst) Part 26: Creating a UI and UX design plan Read More »
Applications that have a lot of records usually have a search feature in them that allows users to search for a particular record instead of scrolling through many of them. In this article, I’ll walk you through how I setup search functionality in the Whinst web app. Search functionality🔎 To implement search functionality I first …
Building a web app(whinst) part 25: Adding search functionality Read More »