Showing posts with label javascript. Show all posts
Showing posts with label javascript. Show all posts

Thursday, 24 July 2025

My Code vs AI(Co-Pilot): I Spent About 75 Minutes Solving a Pyramid Problem on CodeSignal — Here's What I Learned

Today I went on CodeSignal looking for a fun coding challenge to sharpen my JavaScript skills. I came across an ASCII art problem that looked deceptively simple:

Can you generate a pyramid of asterisks with N rows?
Each level adds two more stars than the level above, centered with proper spacing.

Here's what it looks like for N = 5:

    *    
   ***   
  *****  
 ******* 
*********

And for N = 10? That’s what I set out to build.

⏳ Time Spent: 1 Hour 15 Minutes

I took this challenge seriously—no AI help. I wanted to test my problem-solving process.

Here’s my final code after 75 minutes:


const printChar = "*";

function buildPyramid(rows){
    var asteriskCount = rows * 2;
    var pyramid = [];
    var spaceCount = 0;
    for(i = 0; i < rows; i++){
        var asterisks = "";
        for(c = 0; c < (asteriskCount - 1); c++){
            asterisks += printChar;
        }
        pyramid.push(addSpace(asterisks, spaceCount));
        asteriskCount -= 2;
        spaceCount += 2;
    }
    
    return pyramid.reverse();
}

function addSpace(item, spaceCount){
    var before = "", after = "";
    const space = " ";
    for(i = 0; i < (spaceCount / 2); i++){
        before += space;
        after += space;
    }
    return before + item + after;
}

console.log(buildPyramid(10));

🤖 AI's Solution (Much Simpler)

Out of curiosity, I later asked Copilot/AI to solve it, and this was its version:

(Q)Can you write a program that generates this pyramid with a N value of 10 in JavaScript? 


function generatePyramid(N) {
  for (let i = 1; i <= N; i++) {
    const spaces = ' '.repeat(N - i);
    const stars = '*'.repeat(2 * i - 1);
    console.log(spaces + stars);
  }
}

generatePyramid(10);

💡 Takeaways

  • Don't overthink simple problems: I went deep with logic and arrays, while the AI focused on core string operations.
  • Learning happens in the process: Writing my own solution helped me practice nested loops, string manipulation, and thinking in reverse order.
  • AI is a powerful reference, but it's also satisfying to struggle and arrive at your own solution.

If you’re learning JavaScript or just want to keep your brain sharp, try solving small visual problems like this. You’d be surprised how much you can learn from 10 rows of asterisks.

👨🏽‍💻 Have you solved something cool lately? Drop a link or comment below!

Monday, 1 February 2016

Ultra-light and simple Accordion With Jquery

Hello,
remember to include jQuery library before the javascript code below.
here is the code:
JS/Jquery:
if($('.faq-post').length){
        var self = $('.faq-body');
        $('.faq-body .faq-answer').hide();
        $('.faq-question').on('click',function(e){
            $('.faq-answer').hide();
            $(this).next().show();
            e.preventDefault();
            return false;
        });
    }
HTML:
<article class="col-xs-12">
<div class="faq-body">
<h5 class="faq-question"><a href="#" title="">Topic heading </a></h5>
<div class='faq-answer'>Content</div>
</div>
</article>
You can add you style as you wish.
Enjoy!!!

Follow me on twitter: http://www.twitter.com/_josiah_king Join me on Google+: https://www.plus.google.com/u/0/113541005774136102412/posts/p/pub?cfem=1

Monday, 18 January 2016

Developing a web base fingerprint/biometric software using PHP and Javascript

Hello, i got some request few days ago on how to use fingerprint with php. Here are some useful links to check out if you are considering developing a web base fingerprint app.

http://jayakody2000lk.blogspot.com.ng/2009/07/phphd-server-side-hardware-port-access.html
https://github.com/Valve/fingerprintjs2
https://www.npmjs.com/browse/keyword/fingerprint
http://www.bayometric.com/web-based-biometrics/

And yes, it is possible with todays technologies, but not directly. I am yet to develop a fingerprint software of any platform, so i have not test any of the above solutions.

Follow me on twitter: http://www.twitter.com/_josiah_king Join me on Google+: https://www.plus.google.com/u/0/113541005774136102412/posts/p/pub?cfem=1

Saturday, 24 January 2015

How to check if value is a number (isNumer()) in javascript

After Stubbling at this challenge, i googled and found different solutions include the jQuery implementation of this, but none seems to do what i wanted, they either return true or false.
I wanted to know if a value is a number whether it's a typeof string or number. The codes below did the job very well, unlike !isNaN() or $.IsNumeric() which return true in the case of newline or space.
var isNumber = function(v){
    //return typeof v === 'number' && isFinite(v);
    return !isNaN(parseFloat(v)) && isFinite(v);
}
The commented code is the yahoo UI implementation which i tried but didn't give me what i wanted.
Return false if typeof is 'string' while true if typeof is 'number'. But the uncommented code does the job.

Than you for reading. Please post your comment.

Tuesday, 6 August 2013

Summernote WYSIWYG Editor built base on Bootstrap Framework

Summernote is among the best WYSIWYG built with bootstrap framework and JavaScript. It saves web developer hustle on complex WYSIWYG editor due to its simplicity and user friendly interface.



Summernote uses open source libraries(jQuery, Bootstrap, font-awesome),
To view the DEMO
To DOWNLOAD the sourcecode
I really like to use summernote becuase of its simplicity and base on bootstrap(responsiveness).
Click to know more about #summernote 

Thank you for reading.
Follow me on twitter: @_josiah_king

Programming JavaScript Applications - The Digital Version

With this digital Early Release edition of Programming JavaScript Applications, you get the entire book bundle in its earliest form, so you can take advantage of this content long before the book’s official release. You’ll also receive updates when significant changes are made, as well as the final ebook version.

Take your existing JavaScript skills to the next level and learn how to build complete web scale or enterprise applications that are easy to extend and maintain. By applying the design patterns outlined in this book, you’ll learn how to write flexible and resilient code that’s easier—not harder—to work with as your code base grows.

JavaScript has become one of ehe most widely used—and essential—programming languages for the Web, on both the client-side and server-side. In the real world, JavaScript applications are fragile, and when you change them things often break. Author Eric Elliott shows you how to add features without creating bugs or negatively impacting the rest of your code during the course of building a large JavaScript application.
Early Release content now available:

AMD
Asynchronous Operations, Callbacks, Promises and Deferreds
Code Quality
Function Polymorphism
Function Scope, Hoisting and Closures
Functional Programming and Stateless Functions
Immediately Invoked Function Expressions
Interfaces
JavaScript Style Guide
Lambdas
Method Chaining and Fluent APIs
Method Context
Named Parameters
Node Modules
Object Factories
Partial Application and Currying
Plugins
Principles of Modularity
Prototypal Inheritance, Prototype Cloning and the Flyweight Pattern
The Module Pattern
Unit Testing

Coming soon:

Architecting for Scale
Collaboration, Build, Continuous Integration, Deployment
Communicating with Servers and APIs
Designing and Programming RESTful APIs with Node.js
Event-driven, Modular Client Side Application Architecture
Feature Toggles
Internationalization
Logging and Cross Cutting Concerns
Separatian of Concerns (MVC, etc.)

Eric Elliott is a veteran of JavaScript application development. He is currently a member of the Creative Cloud team at Adobe. Previous roles include JavaScript Lead at Tout (social video), Senior JavaScript Rockstar at BandPage (an industry leading music app), head of client side architecture at Zumba Fitness (the leading global fitness brand), and several years as a UX and viral application consultant. He lives in the San Francisco bay area with the most beautiful woman in the world.
Courtesy: http://ericleads.com

Follow me on twitter: @_josiah_king
Join me on Google+: https://plus.google.com/u/0/113541005774136102412/posts/p/pub?cfem=1

An interview with Eric Elliott, Author of “Programming JavaScript Applications”

Interviewed by Adam Flaherty (O’Reilly)

1. Why is your book timely – what makes it important right now?

JavaScript is really hot right now. It’s the most-used and most in-demand programming language in the world, and the upward trend that got us here is still growing. The realm of possibilities with JavaScript is expanding right on with it. These days, the browser is the platform for almost every type of app, from productivity tools to fully immersive 3D video games. It’s also expanded into the back end, where it powers production servers for the biggest (and smallest) companies in the business. Learning JavaScript and Node will put you on the most wanted list of thousands of technical recruiters.

2. What information do you hope that readers of your book will walk away with?

Most JavaScript professionals had limited experience working with JavaScript in full scale applications when I started working on the book. There were few other books that talked about modern JavaScript techniques, or how to use JavaScript to build large applications. I want the readers to walk away with a better understanding of modern application architecture and programming techniques, from unit testing to front end separation of concerns (like MVC), to writing web services in Node. It’s more of an overview of each area than a deep dive into any particular one, but it should give an experienced programmer enough examples and insights to get started, and to have some idea of where to go next.

3. What’s the most exciting/important thing happening in your space?

It’s so hard to say there’s a most exciting thing happening in the JavaScript world. So many things are taking off at the same time. Node is exploding. It’s being used for everything from web servers to robotics, including artificial vision and audio processing.

WebGL games and demos are showing technology that would have been impressive on native desktops five years ago. It might be another five years before web games can compete with the technical capabilities of today’s desktop and platform games, but it’s clear that’s the direction we’re headed in.

That’s really exciting for more than just the game community. It will also impact consumer expectations of what’s possible with website user interfaces. I think we’ll see the shift first in entertainment properties and ad agency content, but the web experience is definitely going to get more immersive in the very near future. It’s already starting to happen.

Of course, all of that will benefit from the dramatic changes coming to the JavaScript language itself. ES6 is well on its way to adding some very cool features to JavaScript. Destructuring assignments, generators, rest parameters, and array comprehension are all exciting and welcome additions to the language. It may be a while before we can freely use these new features in our browser code, but some of them are available for experimentation right now.

4. Please include a short list of 5 tips and tricks.

1. Write short functions. In JavaScript, you’ll have some long functions that are unavoidable (such as wrappers for module scope), but the stuff that’s actually doing all the work should be really short. Aim for les than about a dozen lines. Short functions are more flexible, more reusable, and much easier to read. Keep it simple.

2. Unit test all of your surface-area code. That means, if you export a function for somebody else to use, that function should be covered by tests. Make sure you remember to test for edge and error cases.

Unit tests are more than just an assurance that your code does what it’s supposed to do. They can also act as an implementation checklist to help you while you’re developing your code. Of course, the best part about unit tests is that code is a changing, ever evolving thing. Unit tests give you the assurance that when you go in and make changes, whether they’re bug fixes, feature additions, or refactors, you’ll know right away if anything goes wrong. Just run your test suite and make sure the tests still pass.

Unit tests teach you discipline, and provide you with a deep debugging insight into your code. It really helps to know what still works and what doesn’t when a bug creeps in, and short of littering your code with all sorts of logging statements, unit tests give you better insight into that than almost anything else you can do. I know there are lots of developers on the fence about this, or just not sure where to begin. Here’s your kick: It’s worth the effort to figure it out.

3. Don’t get attached to any particular implementation of your code. A month from now, you’re going to wish you’d done things differently. Get used to it. Once you’ve set down your code, forget about the pride in your implementation. The important questions are, “does it do the job?” and “will it be easy to change?” — emphasis on the second question.

“Code by itself almost rots and it’s gotta be rewritten. Even when nothing has changed, for some reason, it rots.” – Ken Thompson

4. Learn the native capabilities of JavaScript, and take advantage of them. In particular, functional programming techniques (lambdas / closures / partial application, the words sound more complicated than the techniques actually are), object literals, dynamic object extension, prototypes, factories, and fluent APIs for objects (lots of methods could be improved if they returned this). When used together, I call this “fluent style JavaScript”, referring to fluency in a language. I didn’t invent it (jQuery is written in mostly fluent style, for example). It’s just what people who are fluent in JavaScript do.

5. Really learn prototypes. No, I don’t mean learn how to assign things to a constructor prototype, I mean really learn how to use prototypes to full advantage. For more on why prototypes are so cool, and a simple tool that will help you use them effectively, see this post on my blog: Fluent JavaScript: Three Different Kinds of Prototypal OO.


Follow me on twitter: @_josiah_king
Join me on Google+: https://plus.google.com/u/0/113541005774136102412/posts/p/pub?cfem=1