Hello, I am Alexandru Dragos

This portfolio was made using NextJS. It uses ISR (Incremental Static Regeneration) to fetch the data from Sanity. It revaildates the data at most once every day.

I chose Sanity to manage my data, because it is a great headless CMS (Content Management System). I can update all the data that I need from anywhere on Sanity and it will show on the portfolio page.

This portfolio website is using:

- React JS,
  
- NextJS,
  
- ISR (Incremental Static Regeneration),
  
- Tailwind CSS,
  
- Framer Motion
  
- Sanity
  

To run the project locally, enter the following in the command line / bash:

```shell
$ git clone git@github.com:GAlexandruD/ad-portfolio.git
$ cd ad-portfolio
$ yarn
$ yarn dev
```

My portfolio webpage with all the projects.

NextJS

Tailwind CSS

Sanity

TypeScript

GitHub

React

JavaScript

ad-portfolio

Challenge Objectives:

1. Import the enclosed CSV file
2. Tabular representation of the data from the CSV file
3. Creation of new data records using the same schema
4. Processing of existing data records
5. Percentage representation of data records as a chart (bar or pie chart)
6. Export all data as a CSV file with the same scheme

#### The web app was made with ReactJs and I have used the following 3rd party libraries:

- [tailwindcss](https://tailwindcss.com/) - Simple CSS framework for designing the front end;
  
  - for Code Challenge 1:
    
    - [react-google-charts](https://www.react-google-charts.com/) - easy to use and good looking chart library;
      
    - [xlsx](https://sheetjs.com/) - for extracting data from csv files and generating new files;
      
    - [react-table](https://react-table.tanstack.com/) - is a lightweight and extensible data tables for React;
      
    - [react-icons](https://react-icons.github.io/react-icons/) - popular icons.
      
  - for Code Challenge 2:
    
    - [html2canvas](https://html2canvas.hertzen.com/) - for generating the image from the html;
      
    - [react-cropper](https://github.com/react-cropper/react-cropper/) - for cropping the image;
      
    - [react-color](https://casesandberg.github.io/react-color/) - for the color picker;
      
  - for Code Challenge 3:
    
    - [html2canvas](https://html2canvas.hertzen.com/) - for generating the image from the html;
      
    - [react-color](https://casesandberg.github.io/react-color/) - for the color picker;
      

#### To run the project locally, enter the following in the command line / bash:

```shell
$ git clone git@github.com:GAlexandruD/udg-fcc.git
$ cd udg-fcc
$ yarn
$ yarn start
```

 udg-fcc

#### Fastfood Page

When the user opens the page, a predefined list of stores is displayed. The user can press the **View Fasfoods nearby** button and fetch a list of stores that are nearby, based on the browser location.

When clicking a fastfood store, the browser loads a page with details for that store: name, address, picture, type of restaurant and can upvote the store.

#### Recipes Page

For a specific type of food, there is a search function based on cuisine, sort, diet and intolerances.

When clicking the recipe, the web page will display the list of ingredients, a little summary and instructions. All of these can be transformed to speech by pressing the **Talk** button.

#### Features:

- Hosted online (vercel.com);
  
- Foursquare API for locations;
  
- Spoonacular API for recipes;
  
- Firestore database
  

To run the project locally, enter the following in the command line / bash:

```shell
$ git clone git@github.com:GAlexandruD/iwp-testing.git
$ cd iwp-testing
$ yarn
$ yarn dev
```

This is a web app where the user can search for local fastfood restaurants, search for a specific recipe or just transform text to speech.

Firebase


You can buy and sell NFTs.

#### Features:

- Next.js
  
- thirdweb
  
- Tailwind CSS for styling
  
- Hosted online
  
- Metamask login
  

To run the project locally, enter the following in the command line / bash:

```shell
$ git clone git@github.com:GAlexandruD/ebay-clone-youtube.git
$ cd ebay-clone-youtube
$ yarn
$ yarn dev
```

thirdweb

nft-marketplace

#### In this project I have learned to:
- Handle Dynamic data (SSR alternative in Next.js 13)
- Use Stepzen to launch a GraphQL interface which we query from via the newly updated FETCH API (with next.js 13 revalidation & caching additions)
- Use Typescript to reduce the overall number of Bugs and Errors 
- How to handle Static data with updates (ISR alternative in Next.js 13)
- Search the News API via keywords and categories.

To run the project locally, enter the following in the command line / bash:

```shell
$ git clone git@github.com:GAlexandruD/news-app.git
$ cd news-app
$ yarn
$ yarn dev
```

A small project made in NextJs 13 to test its new features, especially the new App folder structure.

GraphQL

StepZen

news-app

This webapp is searching for available locations for the specified dates and it displays them on the map.

#### Features:

- Next.js
  
- Server Side Rendering
  
- React Hooks
  
- Custom map from Mapbox.com
  
- Tailwind CSS for styling
  
- Hosted online
  

To run the project locally, enter the following in the command line / bash:

```shell
$ git clone git@github.com:GAlexandruD/airbnb-clone.git
$ cd airbnb-clone
$ yarn
$ yarn dev
```

Details for: news-app

In this project I have learned to: