Skip to content
OverviewSolutions
25
Comments
6
Whitegod Kingsley
@iamwhitegod

All comments

  • Chamu•13,130
    @ChamuMutezvaSubmitted over 1 year ago

    Hi all. This was one of the most challenging project that I have taken so far. I created the project as a fullstack app using node, express and mongodb for the backend and React for the Frontend.

    Having said that, they are some grey areas that I still need to workout. The todo has a list of the tasks that are yet to be completed. One of the major task is to move focus as soon as a user selects to create a new invoice. At present, the focus remains in the Homepage.

    Highlights

    The invoice app is designed to fetch invoices that are stored in Mongodb. Fetching is done with axios and TanStack Query(React Query) , it was my first time using React query and took a while to grasp it. It does simplify the process of data fetching and it's management as most functions are built in. For example fetching all the invoices and a single invoice is done using useQuery, whilst the rest of the crud operations are performed with the help of useMutation.

    Invoice App - TanStack Query(React query) , React Hook Form

    1
    Whitegod Kingsley•450
    @iamwhitegodPosted over 1 year ago

    Awesome work man. Tho you need to fix the edit popup sidebar scrolling.

    0
  • Whitegod Kingsley•450
    @iamwhitegodPosted over 3 years ago

    Hello, Suraj1333

    To achieve responsiveness, try using percentage values for widths & heights instead VH & VW to avoid running into issues that comes with it.

    0
  • Whitegod Kingsley•450
    @iamwhitegodPosted over 3 years ago

    Hello, GlenOttley

    Cool Implementation and use of BEM naming convention. Keep it up

    1
  • yossef alatter•540
    @yossefAlatterSubmitted almost 4 years ago

    it take some time but finally i do it i using Vue.js and jquery in that app i try to use jquery-ui in vue.js to make sortable list but i face some problem it don't work yet so if can you help to slove that problem i will be happy by your feedback also if you see any nodification tell me or if you want to ask about any thing i will happy by your feedback

    Todo app using Vue.js and jquery

    1
    Whitegod Kingsley•450
    @iamwhitegodPosted almost 4 years ago

    Hi, Yossef

    For the sortable list, you can use the native Html & Vanilla Javascript API. Checkout MDN Documentation for more details or you can use a really cool Library called Sortable Js. Trust me, it is super easy to set up.

    You will get the drag & drop functionality working in less than 10 lines.

    Happy Coding!!!

    0
  • Boluwatife Johnson•45
    @booluwSubmitted almost 4 years ago

    I would love help on the gradient border. Tho my hack seems to get the job done, a better approach would be more accepted, cheers!

    Vue JS site using Sass

    1
    Whitegod Kingsley•450
    @iamwhitegodPosted almost 4 years ago

    Hi, Johnson

    Great Job!! But you didn't seem to add the drag & drop functionality.

    0
  • Grace•30,990
    @grace-snowSubmitted about 4 years ago

    Using accessible component from: https://github.com/scottaohara/a11y_styled_form_controls

    This repo should provide explanatory notes on how and why the toggle was built like that.

    Includes:

    • fully accessible toggle switch
    • javascript to toggle a class to show/hide the correct prices
    • responsive (clamped) font sizes
    • mobile first design

    Ideally, this sort of component should read dynamic data and insert the prices in rather than hard-coding in HTML. But I don't have time for all that today!

    Let me know if anything's broken :)

    Accessible toggle in HTML, CSS and JS with explanatory notes

    4
    Whitegod Kingsley•450
    @iamwhitegodPosted almost 4 years ago

    Liked how you made use of comments in your style.scss file.

    0