Dynamic Web Technologies

What is WordPress? WordPress is a simple and easy to use service for creating websites and web content such as blogs and eCommerce facilities. In this case, I will be attempting to create a WordPress site with a suite of facilities which will showcase my technical ability in API usage, WordPress functionality, JQuery and other client-side techniques. The site will include: Theme usage (Child themes & modification) Plugins Widgets Custom coding JQuery site enhancements API usage to fetch weather forecast in 'Tom Land' API usage to fetch top 10 shows from Apple.  Themes  What are themes? Themes are essentially the blueprint for the layout of your site. Themes determine how the site will look, and where headers, text, content is placed.  Themes are easy to make and alter, with thousands of WordPress themes being available on the application. Although, WordPress provides you with their own default 'Twenty Twenty 'x' ' theme for the current year, along with previ...

What are plugins and widgets? WordPress allows for free and accessible additions to the stock WordPress site in the way of plugins and widgets.  Widgets can best be described by outputting content, such as a sidebar, or a cart system.  Plugins, on the other hand, provide new functionality to the WordPress site. In this post, I will display how I used both widgets and plugins in my own WordPress site. Plugins As the site I am aiming to create has eCommerce functionality, finding a plugin for this purpose makes sense. One of the most popular eCommerce plugins for WordPress is WooCommerce. WooCommerce provides users with the ability to upload stock, prices and descriptions to their own 'shop', available for purchase. The Plugin has a lot more functionality, but this is all I will need it for. Starting off by visiting the 'plugins' page within WordPress, we can search for WooCommerce. From there, it is easy enough to add your own products to the system from the products tab...

Adding custom code to WordPress Now that my shop is functional, it is time to add some extra functionality to the site, and a showcase of some technologies. Adding custom code to WordPress can be achieved by creating files within your theme folder, where the style sheet is kept. It can be tricky to add code in to WordPress as the site has it's own scripts that run when a site boots, which are essential to the functionality of the site. If these fail to run, or are run in a different order, then your site could face issues.   To avoid this conflict, a 'functions.php', file is added to the folder. Overall, this file allows users to add or change default features within your theme. In this case, this will allow the queuing of script files, including my custom script. It is now time to add some functionality to the site using API's and a selection of client-side technologies. Weather After signing up to use OpenWeatherMap's API, you are provided with an API key which ca...

Reddit API For this section, I will be using the Reddit API to perform CRUD on my own subreddit - r/tom_land. Reddit generously offers an API to perform almost all user actions on their site, from scraping posts to moderator duties. Reddit, though, specify in their documentation that users must be authenticated using Oauth to make requests to the API. Oauth is a authentication system which grants access to particular individuals or groups typically using a client ID / secret key combination. This pair is essentially a username and password to access resources on Reddit. Once sent to the server, it knows that you are authorized to access resources, and grants an access token so you can do so. Upon signing up to use the Reddit API, and stating your application is not for commercial purposes, you are supplied with your client ID, and secret key. After making a few test posts on my subreddit, I was ready to start accessing Tom Land.  To begin with, once the document is ready my provide...

The next piece of the puzzle is to create a post for my subreddit using my application.  For this, Reddit requires key pieces of info or the request will fail. First of all, the 'sr' field is needed, stating the subreddit you wish to post in. Without this, Reddit would not know where to post the content you wish. Secondly, a 'kind' is needed. This could be either 'link', signifying a link to an external source such as a news article, or 'self'. The latter option is for posting a self post (by you) with a title and body - the regular format for a post. Lastly, the title and text of the post is required (obviously). Since this request is being made by AJAX there must be a way to fetch the data that the user has entered in to the request. This stumped me for a while, as my go-to was to use an HTML form, but this system is not synonymous with AJAX, as they achieve the same outcome in a different way. So for this, input boxes with specific ID's are used. ...

Delete In terms of CRUD, deleting a post is technically part of the easier half. All the server needs to know is what to delete, and that you want to delete it. With the Reddit API, things are not much different. All the server needs is a POST request sent to reddit.com/api/del, with an identifier of the resource to be deleted like an id. Below is my solution to this: As with before, the access token and type are sent in headers. An issue I faced with this request is that I thought the server required the post 'id', which it does not. When reviewing the Reddit API documentation, how the server identifies what to delete is through it's 'fullname' - sent as 'id'. The fullname of an object is the combination of a thing's type such as link, or selfpost, appreviated to 't*_', along with the id of the object itself. for example: t3_fh7si is the fullname for a selfpost with the id of fh7si.  Another issue I faced originally when getting this function to...