Web Development #

We aim to accomplish two main things with this next section of the course.

1. Provide introduction to GUI Design
2. Provide Introduction to Web Development

There are a couple of reasons as to why these two items are related and why we are choosing to kill two birds with one stone here instead of splitting these into separate topics. If you are interested you can read our thoughts in the Course Rationale

By the end of this section we will be able to create a website that we can interact with instead of the terminal applications we have been building so far. You will be able to do some graphic design work and we can introduce you to some of the concepts in User Experience (UX) design.

There are two things we can do with this. If we are building a desktop application, we can use this as our Graphical User Interface (GUI) or we can use it to launch a website that people will be able to access from their computer or from their phones.

The choice will be up to you probably…

To do this we will start with a new template that has been expanded to encompass the electric clojure system.

So I am thinking topics will be #

• Client server architecture basics
• Clojure common and reader conditionals
• Specifics to our template
• Running the main program with local host
• Making a small change and seeing the hot reloading in action
• Styling with TailWind
• Concept of SPA
• Concept of responsive web apps
• …

Project 1: Producing a Basic Static-like Site #

where we are not doing forms or anything with this project, just playing around with the template

• How images are added to web pages
• Adding HTML DOM elements etc.
• Styling with TailWind

Project 2: Do more Dynamic stuff #

Options could be chatting app, or anything in the clojure electric tutorials Use of my component library that is currently in progress…

Project 3: Create a reusable component #

I have a design template almost done at this point that will help guide how this should be done. Essentially how the atom is passed into the system so that you have a reusable custom form component etc.