AI art refers to the creation of visual art using artificial intelligence algorithms. The use of AI algorithms in creating art has generated a lot of discussion and debate in the art world, with one of the critical questions being whether AI will replace artists.
When it comes to what makes art good, is it the technique used to create the artwork or the ability to lay out the scene, characters, and items in a pleasing way? Both of these elements are important in creating successful artwork, but there is a growing consensus that the composition of the work is what makes it truly good.
Artists have a unique ability to understand what makes a composition pleasing to the eye. They have a deep understanding of color theory, balance, and proportion. They can create compositions that evoke emotions and tell a story. In contrast, AI algorithms can create art that is technically sound, but it often lacks the emotional depth and narrative that artists can bring to their work.
I don’t beleive AI art will replace artists. While AI algorithms can be used to create visually stunning artwork, they lack the emotional depth and narrative that artists can bring to their work. Artists will always excel in knowing what makes a pleasing composition, and their skills and expertise cannot be replicated by machines.
So, AI art is an exciting development in the world of art (and AI), but it should not be seen as a replacement for artists. Artists will always play a crucial role in the creation of art that evokes emotions and tells a story. The unique abilities of artists will always be essential in creating truly great artwork.
Category: Software Development
AI is a Tool, like any other
Artificial Intelligence (AI) is becoming an increasingly important tool in the modern world of writing, changing the way articles are written and published. However, just like any other tool, its use is often the subject of debate. In this article, we’ll explore the role of AI as a tool in article writing, and why we don’t need to make a fuss about its use.
First, let’s consider the argument that people need to be aware of the limitations of AI and understand how it’s being used to influence their decisions. This is a valid concern, but it’s not unique to AI. The same argument could be made for any tool that’s used in article writing, such as Microsoft Word or the pen or pencil used to write the article.
When we write an article, for example, it’s not necessary to announce the make of pen or pencil used, or the software used to format the manuscript. The same applies to AI. If we’re using AI to help us write an article, it’s not necessary to make a big deal about it. The most important thing is the content of the article itself, not the tools used to create it.
Another argument is that AI is more powerful than other tools and therefore, it’s important to be aware of its limitations. While it’s true that AI is a powerful tool, it’s still just a tool. It’s not making decisions on its own, but instead, it’s being used by people to make decisions. The limitations of AI should be considered in the same way as the limitations of any other tool.
Finally, it’s worth noting that the use of AI can lead to increased efficiency and effectiveness in article writing. Just like any other tool, AI can be used to automate repetitive tasks, freeing up time for more valuable work. AI can also help us to analyze data and make better decisions, making our writing more accurate and effective.
AI is just another tool in the world of writing, and its use should not be cause for concern. The most important thing is how the tool is being used, not whether or not it’s AI.
ChatGPT by OpenAI
ChatGPT and GPT-3 by OpenAI,are trained AI models and can generate text on various topics, including answers to education homework. Through my observations, I have come to the conclusion that it’s time for us to rethink the way we approach AI in education.
Traditionally, the focus in education has been on teaching children how to perform specific tasks, such as writing an essay or solving a math problem. While these skills are important, they don’t necessarily prepare students for the future. In an era where AI is becoming increasingly prevalent, it’s crucial that we teach children how to think, not just what to do.
One of the main reasons for this shift is that AI has the potential to automate many of the tasks that students are currently taught to do. In the near future, machines may be able to write essays and solve math problems faster and more accurately than humans. This means that the skills that students are learning today may become obsolete in the future.
Instead of teaching students how to do specific tasks, we should be teaching them how to think critically and creatively. These are skills that are unlikely to be automated by AI and will become increasingly valuable as technology continues to advance. By teaching children how to think, we are preparing them for a future in which they can adapt and thrive, no matter what changes come their way.
In addition to being future-proof, teaching children how to think also has numerous other benefits. It helps them to develop problem-solving skills, encourages creativity and innovation, and promotes independent thinking. These are all skills that are essential in the modern world and will help students to succeed in any field they choose to pursue.
It is time we embrace the exciting potential of AI in education, it’s crucial that we rethink our approach. Instead of teaching children how to do specific tasks, we should be teaching them how to think. By doing so, we are preparing them for a future in which they can thrive and succeed, no matter what changes come their way.
(Yes, most of this post was written by AI)
Http 301
Interviews are sometimes very interesting as they can point out where you are missing some key information in what you know. In an interview last week I was asked how I would redirect a browser to a new URL.
I immediately suggested using a page with a redirect imbedded using JavaScript – I’ve done this a few times :). The interviewer then gave a hint of status codes…..
I know all about HTTP status codes (2?? = success, 3?? = redirect, 4?? client error, 5?? server side error). And I have used a number of the 200, 400 and 500 errors. So I knew that code 300s was for redirect but I had never actually used them to do so.
I spent some time over the weekend just working out how to do a redirect using 301 – Permanently moved – just because I had never done it before….
So here is how to do it in PHP
http_response_code(301);
header(“HTTP/1.1 301 Moved Permanently”);
header(“Location: “.$newurl);
Really Simple Svelte Routing
Routing is a key feature on any web page, routing is used to display content to the user based on selections the user makes, for example when selecting a menu option. There are many routing components available but sometimes a very simple routing option is needed and the routing components with all their features may be overkill.
This tutorial will show you a very simple way to add routing into a Svelte single page app. The functionality for the routing is all in one file. In this tutorial we will place it in the main page, but it could easily be extracted out of the main page into it’s own component.
Create Project
To start with lets create a simple Svelte project using one of the base templates. We will be changing all the content on the page but this is the easiest way to get a Svelte project started and running.
Create Svelte project from a simple Svelte template
npx degit sveltejs/template svelte-spa-router
Install dependencies
npm i
Start the application
npm run dev
Page Layout
Our page layout is going to be a simple two column layout with the menu in the left hand column and the right hand column will be used to display the content for the menu option chosen. A CSS framework could be used for the columns, but for this tutorial we will stay with custom CSS classes instead of creating a dependency on a third part library.
In the App.svelte page add the following styles. Svelte allows styles to be applied per component.
<style
.row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
width: 100%;
}
.column {
display: flex;
flex-direction: column;
flex-basis: 100%;
flex: 1;
}
</style>>
Now that we have the styles for a 2 column layout lets create the html for the page. Initially the 2 columns will just display simple headers, but we will replace these later as we build our routes.
Replace all the HTML
<main <div class="row"> <div class="column"> <h1>Menu</h1> </div> <div class="column"> <h1>Content</h1> </div> </div> </main>>
If you are running the development server you should now see the two column display with the headers.
Create a Menu
Let us add a menu in the left hand column using anchor links, replace the text in the first column with our menu
<h1>Menu</h1 <a href="#home">Home</a> <a href="#red">Red Page</a> <a href="#green">Green Page</a>>
This menu uses Location hashes to define the page to be display. When the user click s a menu option the page URL will update to include the hash value. We will then get the hash value from the URL, and based on the selected menu option we will display the relevant page
Get the menu selection
To get the menu selection we need to get the page from the current page.
<script let page = document.location.hash; </script>>
This will extract the page hash from the URL, but we also need to get the page whenever it changes such as when the user selects a menu option
window.onpopstate = function(event) {
page = document.location.hash;
};
Now the current location hash is in our page variable both when the user accesses our page with an existing hash value (such as from a bookmark) and when the user clicks one of the menu options.
Add the Routing
Based on the page variable we now want to change the content in the right hand pane based on the page that was selected. Replace the Content column contents with this script
{#if page==="#home"
Home Page
{:else if page === "#red"}
Red page
{:else if page === "#green"}
Green page
{:else}
404: Page not Found
{/if}}
In the else section we can choose to show whatever page we want to show. In the example above we show an error page, we could have easily shown the home page, maybe even passing a property through to indicate to the user that the request ed page does not exist
Now when you click on the menu options the content on the right will change to display the selected content. At the moment the content is just a simple text string but could be replaced by another component.
Creating the Red Page
To show that routing can be triggered from anywhere we can add a hash link on any page and the routing will still pick it up.
Create a new component called red.svelte. Add the following to the component
<div
<h1>This is the Red page</h1>
<a href=”#green”>Change to Green Page</a>
</div>
<style>
div {
background: red;
color: white;
}
</style>>
Now replace the “Red page” text in the main page with <Red /> (remember to import the red page into the file).
Now choosing red from the menu will diaply the red page content, and from the red page selecting the option to change t the green page will display the green page, as though the green menu option was selected.
Source code available on Github: ReallySimpleSvelteRouting
Custom Bootstrap using Sass
I’ve known about SASS for a long time but never took the time to learn how to use it. For a new project (a University project) I wanted to use Bootstrap but also wanted custom colors on the website. Instead of creating my own CSS I decided to stick with Bootstrap but learnt to modify it for my own color palette.
The project is around COVID-19 and medical testing. As such I wanted to use a custom pallet of
Green representing Health
Blue standing for Medical personnel (Professions)
Yellow for Happiness
I spent some time working out how to achieve this in Bootstrap’s provided Scss files. It was so easy that I felt a bit of a fool that I had not learnt this earlier!
Prerequisites:
Before following this guide, you will need to have Nodejs with NPM installed.
To start lets create a webpage that displays some buttons using Bootstrap. Download boot into the web project (I downloaded Bootstrap sources from https://getbootstrap.com/docs/4.5/getting-started/download/ ). Unzip the sources into the webpage directory.
My HTMl file contains
<html> <head> <link rel="stylesheet" href=" bootstrap-4.5.3\dist\css bootstrap.css" /> </head> <body> <h1>Custom Bootstrap using Sass</h1> <span class="btn btn-primary">Primary</span> <span class="btn btn-secondary">Secondary</span> <span class="btn btn-danger">Danger</span> <span class="btn btn-health">Health</span> <span class="btn btn-prof">Prof</span> <span class="btn btn-happy">Happy</span> </body>
</html>
Which, when viewed in a browser looks like:
A standard looking Bootstrap example of buttons. The last 3 buttons have classes that do not exist so just get ignored and the standard class=”btn” is used for them.
To start customizing the Bootstrap css we need to install the sass compiler. Using NPM run the following command
npm install -g sass
This installs SASS globally so we can run it from any project. Now I can start customizing boostrap to meet my requirements. First I modify the _variables.scss file found in the bootstrap scss folder. Before I get to custom colors, I’ll just change the primary color to check that my configuration is working correctly:
For my test I am going to change the primary color to red instead of the normal Bootstrap blue.
Change line 67 to
$primary: $red !default;
Save the file and now I can compile the Scss into css. In the terminal I run
sass C:\projects\Sass1\bootstrap-4.5.3\scss\bootstrap.scss C:\projects\Sass1\bootstrap-4.5.3\dist\css\bootstrap.css
This command overwrites the originally downloaded CSS file. You could instead place the output file anywhere, for example in a \css directory in your project
Now refresh the web page
We have effectively changed all *-primary classes to be red.
How about creating our own button classes. Would it not be easier to use class btn-happy for a yellow button instead of trying to remember if the primary or secondary is yellow.
In _variables.scss add the following lines after $dark (at line 75).
$health: $green; $prof: $blue;
$happy: $yellow;
In theme-colors in the section below add
"health": $health, "prof": $prof,
"happy": $happy
So that theme-colors looks like
$theme-colors: () !default; $theme-colors: map-merge( ( "primary": $primary, "secondary": $secondary, "success": $success, "info": $info, "warning": $warning, "danger": $danger, "light": $light, "dark": $dark, "health": $health, "prof": $prof, "happy": $happy ), $theme-colors
);
Save the changes and compile Scss to css again
When I refresh the web page I can see my custom colored buttons, using my own class names.
I now have buttons with my custom colors. In fact all the Bootstrap components that use the color pallet are now customized. To show this I can display an alert
<div class="alert alert-happy mt-5" role="alert"> A simple Happy alert—check it out!
</div>
When we refresh the page:
Note also how the compilation process did the same color modulation of yellow to fit the color to suit the other alert colors.
Personally, I like the Bootstrap color theme. But being able to modify it to suit my own requirements makes it a lot easier to customize and use wherever I need it. For the website I am designing I don’t have Primary and Secondary colors. I have three primary colors called Health, Prof and Happy.
Personal Projects (Passion, Bugs and DevOps)
One question I have not been asked in a Job Interview is to discuss my “Personal Projects”. On github.com I have 21 public repositories and 5 private repositories. (I should add at least another 3 private repositories and a public repository based on my current personal projects)
Personal Projects show a developer’s passion for his craft. While at work you are told what languages, frameworks and libraries to use. On your personal projects you are free to explore the wild open expanse of developer options. To be honest I believe 80% of what I have learnt as a developer has been due to working on my personal projects.
If I have learnt 80% of my skills on personal projects, why is this not a question in interviews to find out what people are really teaching themselves?
The stage of development of a personal project is also quite important. If a personal project is being done for learning it’s stage is unimportant. But if a developer has a personal project that has been released for common consumption it probably means the developer has learnt a lot about software release management, software quality i.e. it is likely the developer worries about bugs and bug management!
If personal projects can help a person learn about software quality and bug management why is it not used in interviews to judge a developers commitment to quality?
Github.com now has github actions. Github actions can be used to build CI/CD pipelines. If a developer is using github actions for build and deployment they understand the basics of DevOps. (I dont yet use github actions, but it is on my todo list.)
If by asking about a developers personal projects we can find out about their knowledge, belief in and use of DevOps why arnt we asking about it in interviews?
For any developer looking for a job, your Github.com repositories are a part of your CV. Publish your broken attempts at making things work, publish your pet projects, work on other developers repositories, and make use of the tools available. Tell everyone who is interested in your projects (probably only Geeks like myself want to know what you are working on, but tell everyone anyway). Use your personal projects to show potential employers what you are capable of.
PS. I actually have been asked about my personal projects before – One interview I did was basically a comprehensive code review of one of my public projects. Based on that experience I make sure I keep updating my active repos and adding new repo’s as I learn new things.
PPS. Please send me a link, or comment below with a link, to your own github profile. I’d love to see what people are working on 🙂
Why I choose PHP and JavaScript
I’m a professional software developer but choose to use PHP and JavaScript for my “personal” projects. When other software development professionals hear this I often get asked why, because PHP has “no future”.
It is all about ease of use! Getting a local development server up and running on my new laptop takes about 5 minutes. I just download XAMPP and run an install, for tooling I download VS Code (also free) and I can be developing new code 10 minutes after I open my brand new laptop. Best of all it is completely free!
But, I hear my colleagues say, you could use the cloud for Nodejs, C#, Java etc! Yes I could but those are 1. Not as easy to setup and 2. Not quite as free. If I develop something that has financial possibilities I can upload it onto a basic web hosting site for R40 per month. If and when it becomes a success I can then move it to a real hosting environment.
But, I hear them say again, you can set up a free web application on Azure or a t2.micro on AWS. Again, I agree I could, but then I need to worry about the OS, or the hosting platform, and then I need to check my security so that I can access my MySQL database from my local development machine. With my friendly local hosting provider I get a pre setup FTP account, a click of a button for a MySQL database that I can access from my local machine.
But, yet again <rolls eyes>, that will never be as secure. I agree it isn’t, but so far it’s a simple little idea I was testing out, it is not a super secret app that has my banking details on it.
IF and WHEN I get an idea that works, then taking the time and effort to configure a secure, elastic, load balanced and expensive environment will become worth while.
Code like a Unit Tester
On Tuesday night (2019\05\14) I did a presentation at the Developer User Group. My talk was titled Code like a Unit Tester and focused on the different coding style required to write code that can be unit tested. Overall the presentation took about 7 minutes and I had a good few chats afterwards with people interested in improving their skills in the unit testing area.
Publicly Available LDAP server
I am doing some development where I need to connect to an LDAP server. The final version will be connecting to my work LDAP server but while at home I wanted something easy to test against. I was able to find this link
I’ve started testing my LDAP components against it now.