Skip to main content

Making an iOS app like making a Java web app - Part 1: writing Java web apps

One of the outcomes of my work on my first iOS app is my Github repository Html5StarterAppWithSwift which is an Xcode project template for creating Html5/iOS apps, or maybe we can call it "native Html5 iOS apps"... hmm what do I mean? What I mean is, it's an Xcode project template, that can help you create native iOS apps such that all of the app's UI is powered by Html/Javascript, while it makes use of native iOS code (Swift) for scheduling local notifications, storing data (Core Data) etc.

p.s. if you would like to know about Html5StarterAppWithSwift, you can have a read of this post.

So what is this post about?

I have a background in writing Java web apps i.e. for my day job, I write Java web apps using frameworks such as Struts, Play etc and there is a way in which those Java web apps are written. Now, when I started working on my first iOS app, my Java developer background played a big part in the way I structured my app i.e. separation of code etc. What I mean is, the way I started writing my iOS app i.e. development methodology was heavily influenced by how I have been writing Java web apps and in this post I am going to share my development methodology. Also, instead of writing one long blog post, I will be splitting this into a two smaller blog posts, and in this part i.e. part 1, I will provide a brief overview of how Java web apps are written.
p.s. I am going to describe Java web apps written with an MVC framework in a very simple way.

So how do I write Java web apps?

So typically, a Java web app built using a MVC framework like Struts or Play, has the following properties, 
  1. A set of Java classes that facilitate storage and retrieval of data, typically from the database
  2. A set of Java classes that facilitate communication between the UI components and the database.
  3. The UI which is typically created using HTML/CSS and Javascript
So all that sounds great, but let's try to follow a simple example, so the point really sinks in.

Java web app walkthrough

Say we have a Java based web app(web-site) that is accessible by typing a certain url in a browser and one of it's features is facilitating user registration, now how will that work?
  1. The user will open the web app in the browser by entering it's url in the browser
  2. The url will open a web page HTML based UI which will show a registration form to the user where the user can enter his/her details. The registration form is HTML based and it maybe styled using CSS and depending on the web app's needs, there maybe some Javascript being used to handle events like form submission etc.
  3. The user enters all the details and then clicks register, the register event will invoke a Java Servlet which will save the user's details.
  4. The Java Servlet will get all the user details from the HTML based registration form and then save it to the database. 
  5. Once the data is successfully saved to the database, the Servlet will send a message back to the UI that the details have been successfully saved. The UI can then show an alert or display a message or whatever it needs to do with that info to notify the user their details are saved.
  6. The next time if the user wants to access their details, the Servlet can simply retrieve the user details from the database and send it to the UI.
p.s. I have kept this example intentionally simple so try not to nitpick every little detail or be too pedantic about it. My objective with this example was simply to get my point across regarding separation of concerns with respect to Java web apps, without delving into too many specific details, e.g. MVC pattern etc.

What's next?

In part 2 of this post, I explain why the process of building an iOS app by using an Xcode project template such as this, is very similar to the Java web app walkthrough mentioned above. To me it is pretty much the same as above, the only thing that is different is instead of Java, we use Swift for the iOS app. Ok, how about you have a read of it for yourself, here's part 2.


Finally, if you find my blog posts useful and want to support me you can 
  • Give the Lite(free) version a try and leave a review on the App Store


Comments

Popular posts from this blog

Html5 based widget for an iOS app: Today extension powered by the Ionic framework

At some point the thought of adding a Widget to my iOS app came to mind which was followed by starting work on adding a widget for my app, My Day Todos . Obviously the first step was to learn how to add a Widget to an iOS app and in that learning process I discovered many things about widgets in iOS first of which was a widget in iOS is a an app extension i.e a  Today Extension . While I am still haven't finished working on the widget for my iOS app, I thought I would take some time out and share what I have learned. In this post, I will share a few important tips and provide an example of how to add a Widget to an iOS app and have the widget UI powered by Html5 via  Ionic framework . I added some code to my Github repo, Html5StarterAppWithSwift in order to show how this can be achieved. There are already too many tutorials out on the Web on how to add a Today extension to an iOS app so I won't be including that here. Instead I will focus on sharing some of the useful tip...

Build a Full-Stack Image Upload App with Node.js, Express, React, and Vite (Beginner Tutorial)

 If you’re new to full-stack web development and want a hands-on project to practice React frontend integration with a Node.js + Express backend , this tutorial is for you. In this guide, we’ll walk through a simple but powerful app that lets users upload images, store them on the server, and display them back in the browser. This project is based on my GitHub repo: node-express-react-simple-fileupload . It’s designed to be beginner-friendly, SEO-optimized, and a great starting point for anyone learning JavaScript full-stack development . 🛠️ Technologies Used Here’s the tech stack powering this project: Node.js – JavaScript runtime for the backend. Express.js – Lightweight web framework for building REST APIs. Multer – Middleware for handling file uploads. CORS – Enables cross-origin requests between frontend and backend. React.js – Frontend library for building user interfaces. Vite – Fast development server and build tool for React. Fetch API – For making HTTP requests ...

App update, discovering Protractor(testing) and an Angularjs State machine

So for the last couple of weeks, I have not be able to update my blog or finish a couple of the posts that I started writing. Well, I have...been a bit busy, with some the following things,  Testing my app I have been using the app( iOS ) on my iPhone for the past couple of months now, which is both good and bad. The good thing is I can test it and the bad thing is, I can use it every day. Part of the reason, I started building this app is to have something that I can and like to use everyday and since I am already using it, the incentive to release it is not as high as if it were something that I could not use. Anyway I did make some good progress over the last couple of weeks, like  Delete the app from my iPhone and do a clean install: this did help me find a few simple bugs that would pop-up when the app is first installed GET AN APP ICON, FINALLY! this was a bit of a hurdle and I thanks to Fiverr  and fivercrazyguy , I finally have my app icon. The day job ...