by Petar Gardian, DLINQ Intern
For my personal inquiry during the summer internship, I strived to explore backend website development. I wanted to create a data repository website where Middlebury College students can share class notes, such as images, educational videos, and gifs.
I first tasked myself with choosing the most useful environment for my project. Originally, I started with WordPress but found it too constricting, so I decided to switch to Drupal, a free and open-source web content management system written in PHP. Although Drupal offers various content management tools, after thoughtful advice and some consideration, I had decided to simply use PHP as the main building language for my website. Given that this is a data depository website, I also needed a relational database. I chose MySQL.
For faster and better testing, I developed the webhttp://www.apache.org/site locally using software called XAMPP (the letters stand for an abbreviation for a cross-platform, Apache, MySQL, PHP, and Perl). In conjunction with PHP, XAMPP acts as a local development environment. Additionally, XAMPP ensures that the website is easily moved from a local to a live version through an integrated cross-platform FTP (file transfer protocol) application called FileZilla. In this manner, Midd Notes users will easily be able to upload and download the files from the website.
Photo 1.1. Xampp
Photo 1.2. Upload and Search
I did not have enough knowledge to use PHP properly, so I started using various YouTube tutorials, as well as LinkedIn Learning to piece things together. After I did my research and gained all the necessary knowledge, I started creating a prototype of a website. Through many iterations and testing, I finally created a functioning website. However, the search field wouldn’t yield images as results, just their names. I remember this part of the process clearly because I had spent half of the day trying to fix the problem. In the end, with the help of a friend, we realized that the only problem was the faulty variable connection between the localhost and MySQL database.
Photo 1.3. Results are fetched from the img_dir row inside the midd_notes database
In the image below, Midd Notes has all the basic functionality of a data repository website; an upload field and a search field for retrieval.
Photo 1.4. Upload successful
The most challenging part was establishing the connection between the local host and MySQL database. By creating the connection, all of the uploaded images are stored inside an img_dir row in MySQL, while locally, they are stored on the computer which was used to develop and test the website. This made it easier to categorize, add and remove unnecessary data.
Photo 1.5. MySQL Database
The search field returns results if the full name of the uploaded file was searched for, or even if just a certain part of the word is typed.
Photo 1.6. Data Search
Photo 1.7. Results
The website will need more functionality, as well as interactivity. One of the crucial problems is the reimagination and recreation of the upload field, which will need to include additional search parameters and tags. Additionally, Midd Notes only offers bare functionality and would need to be made user-friendly and accessible.
Photo courtesy of FreePNGLogos; Pixabay