Here is the list of my work in VueJs
Main project I did in the last company. Requirements were to convert traditional php + jquery webiste to vuejs. I used
- Typescript
- Vue 3
- Vuex later pinia
- Webpack 4 later Vite
- SPA later ssr/nuxt
| /** | |
| Welcome to Day 18! Today we're learning about Stacks and Queues. Check out the Tutorial tab for learning materials and an instructional video! | |
| A palindrome is a word, phrase, number, or other sequence of characters which reads the same backwards and forwards. Can you determine if a given string, , is a palindrome? | |
| To solve this challenge, we must first take each character in , enqueue it in a queue, and also push that same character onto a stack. Once that's done, we must dequeue the first character from the queue and pop the top character off the stack, then compare the two characters to see if they are the same; as long as the characters match, we continue dequeueing, popping, and comparing each character until our containers are empty (a non-match means isn't a palindrome). | |
| Write the following declarations and implementations: | |
| Two instance variables: one for your , and one for your . |
| /** | |
| Objective | |
| Today, we're learning about Interfaces. Check out the Tutorial tab for learning materials and an instructional video! | |
| Task | |
| The AdvancedArithmetic interface and the method declaration for the abstract divisorSum(n) method are provided for you in the editor below. | |
| Complete the implementation of Calculator class, which implements the AdvancedArithmetic interface. The implementation for the divisorSum(n) method must return the sum of all divisors of . | |
| Example |
| /** | |
| Objective | |
| Today, we're discussing a simple sorting algorithm called Bubble Sort. Check out the Tutorial tab for learning materials and an instructional video! | |
| Consider the following version of Bubble Sort: | |
| for (int i = 0; i < n; i++) { | |
| // Track number of elements swapped during a single array traversal | |
| int numberOfSwaps = 0; | |
| /** | |
| Today we're discussing Generics; be aware that not all languages support this construct, so fewer languages are enabled for this challenge. Check out the Tutorial tab for learning materials and an instructional video! | |
| Task | |
| Write a single generic function named printArray; this function must take an array of generic elements as a parameter (the exception to this is C++, which takes a vector). The locked Solution class in your editor tests your function. | |
| Note: You must use generics to solve this challenge. Do not write overloaded functions. | |
| Input Format |
| /** | |
| Objective | |
| Today, we're working with Binary Search Trees (BSTs). Check out the Tutorial tab for learning materials and an instructional video! | |
| Task | |
| The height of a binary search tree is the number of edges between the tree's root and its furthest leaf. You are given a pointer, , pointing to the root of a binary search tree. Complete the getHeight function provided in your editor so that it returns the height of the binary search tree. | |
| Input Format | |
| The locked stub code in your editor reads the following inputs and assembles them into a binary search tree: |
| ///// button-atom | |
| add borderRadius: string to index.d.ts | |
| add props borderRadius to button.tsx | |
| add borderRadius: "10px" to default props | |
| // issues: | |
| color property is not working | |
| // solution | |
| remove color property from Button story Text component | |
| add color="primary" props in button.tsx |
| /* | |
| This .scss loop will create "margin helpers" and "padding helpers" for use in your web projects. | |
| It will generate several classes such as: | |
| .m-r-10 which gives margin-right 10 pixels. | |
| .m-r-15 gives MARGIN to the RIGHT 15 pixels. | |
| .m-t-15 gives MARGIN to the TOP 15 pixels and so on. | |
| .p-b-5 gives PADDING to the BOTTOM of 5 pixels | |
| .p-l-40 gives PADDING to the LEFT of 40 pixels |
| import React, { FormEvent } from "react"; | |
| import { SectionTitle } from "@shared"; | |
| import { Text } from "@atoms"; | |
| import { FormText } from "@cells"; | |
| import { Label } from "@molecules"; | |
| import styles from "./Contact.module.css"; | |
| import { FieldHint, FieldLabel, FormSubmit, FormTerms } from "./FormComponents"; | |
| import { radioFields, textFields } from "@/data"; | |
| import { useState } from "react"; |
Hi, this gist will be updated soon.