• February 28th, 2022
• Life
• By Steve Shead
• 0
• 0

Update 5 - It's been a while - but that doesn't mean I've not been busy...

Yep - it's been a while. I have been working in the background on a couple of projects and some life stuff. Nothing bad - new job, moving house, that kinda thing. 

One 'project' is ironing out the bugs for this site. There was a bug such that only one person could login at a time - that defeated the object of having this site. Turns out it was a PDO MySQL statement that had the object and the placeholder back to front - yeah, that one bit, and took quite a while to sort out. Meanwhile I'm trying to use this site to sell stuff - doesn't leave a good impression when folks can't login to retrieve their purchases. Anyway - that one is sorted.

Outside of that I'm building a basic e-commerce store - similar to this but scaled back. This is an exercise in patience since I already have the core code from building this site, and am adapting that. This is where you find the nuances of PHP and HTML when building. You know me though, I'm enjoying the challenge.

One thing I learned from this was to pay attention when nuancing the complexity of the code. I was going through the process of simplifying the code. I had a function that created a footer template - here's that function:

function template_footer() {
$base_url = base_url;
$rewrite_url = rewrite_url ? 'true' : 'false';
$year = date('Y');
$currency_code = currency_code;
echo <<<EOT
        </main>
        <footer>
            <div class="content-wrapper">
                <p>&copy; $year, Shopping Cart System</p>
            </div>
        </footer>
        <script>
        let currency_code = "$currency_code";
        let base_url = "$base_url";
        let rewrite_url = $rewrite_url;
        </script>
        <script src="{$base_url}script.js"></script>
    </body>
</html>
EOT;
}

I had already created a footer.php file so didn't need the function anymore, not realizing that further in the footer.php file Javascript was using the currency_code definition for an AJAX call.  Specically, the code below:

let currency_code = "$currency_code";

Instead of inserting the defined currency_code into the javascript it inserted the phrase '$currency_code' - yeah, it should have been obvious by what it was inserting into the code, but for some reason it wasn't. It took 5 days on and off to find the error I created when refactoring the code. Lesson learned ...but I'm guessing it's not the last time I'll create my own problems.

Here's a screenshot of the front page of the project - it's coming along nicely, lessons included.

As you can see, it's coming along nicely. I have the front page, products page, product page and cart coded - still got a fair way to go but it's getting there. I have to add comments and reviews also, but I've created those in the past so it should be more an integration than writing the code from scratch. Like I said, huge learning curve.

That's enough for now. Just wanted to let you know I'm still alive, still coding, still around, just busy with life stuff as much as code stuff.

UPDATE:

Fast forward a week or three and this one continues to kick my butt. I've gotten a lot further with the build, but each update or edit poses new challengs. Some of the challenges are problems I've created. Trying to work out why a variable printed its name instead of its value - turns out I had to declare the variable inside of PHP tags since it was being used by Javascript and not PHP - that one took a few days and a few brain cells. That should have been obvious - but wasn't!

I'm working on the checkout page right now. This one is a bear, quite complex, and challenging. This page allows you to checkout, but needs an account thus has a login form, as well as a 'create account' form. Checkout options are PayPal and Stripe. Some of the functionality isn't yet working - I would hazzard a guess it's user error on my part - time will tell.

Having started a new job as well as selling our home and buying a home up country there's a little too much going on to maintain enough focus. Not an excuse - it's the nature of things. I will complete this - just won't be soon.

UPDATE 2:

Finally got past the checkout page issues. I had to go back to the drawing board and start that page from scratch. I made sure to test each time I edited or changed something, and it worked. That took a couple of weeks - in between not coding because my head was full! As you might have noticed, I don't give up, and I'm glad I didn't - talk about a learning curve.

A couple of things I want to do:

• Add the ability to create a wishlist
• Add a form to add products to the slider on the index page
• Add the ability to rate the products
• Add the ability to comment on products

Yep - still got a ton of work to do. Right now I'm focusing on an issue with steveshead.io whereby emails are not making it out. I'm using PHPMailer and SMTP through google, but am not finding out why emails aren't being sent. This one is taking some time so I'll probably switch between coding the ecommerce site, and dealing with this one. Onwards and upwards.

UPDATE 3:

The PHPMailer issue is resolved. It was me misinterpreting how the configuration of the mailer.php should be - lesson learned - and that one was bugging me for a long time.

UPDATE 4:

I've done a lot of work on the site now. I've hit a fair few issues along the way that were learning moments. One of which was creating a modal for each product on the same page. It took me a week to realize that I had to not only initialize each instance, but have unique identifiers for the product ID's - and all of that needed to be one with Javascript ...well, JQuery. Of course, I got it done, but each time I move on to anothe part of the build I hit another steep learning curve. Not complaining so much - but - this build is taking a long time. Enough for now...

Back to coding the new, basic e-commerce site now...

UPDATE 5:

Almost done - just need to add the review system and it should be ready to roll. I've got some testing to do as well - if all goes well I'll be putting it up in the store in a couple of weeks. I'm excited because this took a lot of work, and was a huge (and sometimes frustrating) learning curve. I'll post another update when it is ready to roll.

Some things I've learned - when using a modal you need to create a separate id for each, but also if you are incrementing the id on multipe images, those also need to be unique in each modal. The way I got around this we that each modal id was using the product id, since the modal was to show a single product - see below.

id="product<?=$product'id']?>"

Then I needed to increment the id and class of each image used in the modal. That way it didn't matter how many images I added, the id's and classes would always be different for each modal. Here's the code.

<?php $pro = 1; $class = 1; ?> // auto increment the id and the class
<?php foreach ($product_imgs as $product_img): ?> // loop through the product images allocating unique id's and classes
      <div id="product<?=$product['id']?>pro-<?=$pro++?>" class="product<?=$product['id']?>pro-<?=$class++?> tab-pane fade">
            <img src="/imgs/<?=$product_img['img']?>" alt="">
      </div>
<?php endforeach; ?>

It took a while to work that out, and I made a few mistakes along the way, but got it working in the end.

The other issue I needed to get past was writing MySQL joins. I created the ability to add to a wishlist, which in itself was simple enough. Since the wishlist table only has user id and product id, I needed to link it to the product table. Here's how I did that.

$stmt = $pdo->prepare('SELECT p.* FROM products p JOIN wishlist wl on wl.product_id = p.id AND wl.user_id = ?');
$stmt->execute([ $_SESSION['account_id'] ]);
$wishlist_items = $stmt->fetchAll();

That might seem simple enough to those that are used to table joins, but that one hurt my head. I've created a couple more since then and it's getting easier, but it still feels a lot like rocket science. I'll keep practising. 

Tomorrow I'll start on creating the review system. I have code I've used before so I'll try that first. Once that done it should be good to go.

Stay tuned!

As always let me know your thoughts, ideas and opinions - always open to feedback.

Happy coding!

Cheers

Steve

---