An open API service indexing awesome lists of open source software.

https://github.com/lukaszkolodziejski/xxxl_managing-global-servers-2

[ GIF ] ( That is XXXL_Managing-Global-Servers-1 with completely New and Modern Technologies >> Extra Bonuses << ) // 08.2020
https://github.com/lukaszkolodziejski/xxxl_managing-global-servers-2

async axios css-modules css3 enzyme gsap html5 javascript mvp proptypes react react-hooks react-redux-hooks redux-saga redux-thunk rest-api sass yield

Last synced: 8 months ago
JSON representation

[ GIF ] ( That is XXXL_Managing-Global-Servers-1 with completely New and Modern Technologies >> Extra Bonuses << ) // 08.2020

Awesome Lists containing this project

README

          

> ## XXXL_Managing-Global-Servers-2 ( from React to Redux-Saga... ) // 08.2020
>
> > ### _This work the same like XXXL_Managing-Global-Servers-1_, but more Modern and with New Other Technologies:

- [x] All in the function components
- [ ] (XXXL_Managing-Global-Servers-1) Redux & Redux-Thunk
- [x] (XXXL_Managing-Global-Servers-2) Redux & Redux-Thunk & Redux-Saga
- [x] React Hooks (e.g. useState, useEffect, useRef, useMemo)
- [x] React-Redux Hooks (e.g. useDispatch, useSelector)
- [x] PropTypes
- [x] React.memo()
- [x] Testing with Enzyme
- [x] Better syntax of code & fixed some bugs
- [x] More Components to No Repeat the same Code

> #### I connected here a lot of technologies in one place:
>
> #### ... to show what I can create,

```js
JavaScript React.js Redux
Redux-Thunk Redux-Saga Axios
React Hooks React with GSAP ES6
SASS / SCSS function* generator / yield PropTypes
CSS Modules asynchronous components CSS3
HTML5 REST API MVP
Enzyme React.memo() React-Redux Hooks
```

> # How it works ? (14 Steps)
>
> ## I want to show the most important details and possibilities of my application here :) (only 2 min)

---

> ## 1. Start page & load API.
>
> [![Demo CountPages alpha](https://github.com/LukaszKolodziejski/managing-servers-2/blob/master/videoGIF/1-start-load-api.gif)](https://github.com/LukaszKolodziejski/managing-servers-1)

---

---

---

> ## 2. Pointer on one Server:
>
> [![Demo CountPages alpha](https://github.com/LukaszKolodziejski/managing-servers-2/blob/master/videoGIF/2-show-oneserver.gif)](https://github.com/LukaszKolodziejski/managing-servers-1)

---

---

---

> ## 3. Dropdown for different statuses:
>
> [![Demo CountPages alpha](https://github.com/LukaszKolodziejski/managing-servers-2/blob/master/videoGIF/3-dropdown.gif)](https://github.com/LukaszKolodziejski/managing-servers-1)

---

---

---

> ## 4. Animation -> "Turn Off":
>
> [![Demo CountPages alpha](https://github.com/LukaszKolodziejski/managing-servers-2/blob/master/videoGIF/4-turnoff.gif)](https://github.com/LukaszKolodziejski/managing-servers-1)

---

---

---

> ## 5. Animation -> "Turn On":
>
> [![Demo CountPages alpha](https://github.com/LukaszKolodziejski/managing-servers-2/blob/master/videoGIF/5-turnon.gif)](https://github.com/LukaszKolodziejski/managing-servers-1)

---

---

---

> ## 6. Animation -> "Rebooting":
>
> [![Demo CountPages alpha](https://github.com/LukaszKolodziejski/managing-servers-2/blob/master/videoGIF/6-rebooting.gif)](https://github.com/LukaszKolodziejski/managing-servers-1)

---

---

---

> ## 7. Fast changes statuses:
>
> [![Demo CountPages alpha](https://github.com/LukaszKolodziejski/managing-servers-2/blob/master/videoGIF/7-fast-changes.gif)](https://github.com/LukaszKolodziejski/managing-servers-1)

---

---

---

> ## 8. Search engine (appearance and operation):
>
> [![Demo CountPages alpha](https://github.com/LukaszKolodziejski/managing-servers-2/blob/master/videoGIF/8-search-look.gif)](https://github.com/LukaszKolodziejski/managing-servers-1)

---

---

---

> ## 9. Show the number of servers found:
>
> [![Demo CountPages alpha](https://github.com/LukaszKolodziejski/managing-servers-2/blob/master/videoGIF/9-search-number.gif)](https://github.com/LukaszKolodziejski/managing-servers-1)

---

---

---

> ## 10. Show only searched servers:
>
> [![Demo CountPages alpha](https://github.com/LukaszKolodziejski/managing-servers-2/blob/master/videoGIF/10-search-work.gif)](https://github.com/LukaszKolodziejski/managing-servers-1)

---

---

---

> ## 11. Change the status of the searched servers:
>
> [![Demo CountPages alpha](https://github.com/LukaszKolodziejski/managing-servers-2/blob/master/videoGIF/11-search-status.gif)](https://github.com/LukaszKolodziejski/managing-servers-1)

---

---

---

> ## 12. Cleaning the search engine:
>
> [![Demo CountPages alpha](https://github.com/LukaszKolodziejski/managing-servers-2/blob/master/videoGIF/12-search-clear.gif)](https://github.com/LukaszKolodziejski/managing-servers-1)

---

---

---

> ## 13. Responsive View from large Desktop to Mobile Version:
>
> [![Demo CountPages alpha](https://github.com/LukaszKolodziejski/managing-servers-2/blob/master/videoGIF/13-responsive-view.gif)](https://github.com/LukaszKolodziejski/managing-servers-1)

---

---

---

> ## 14. Fast summary all of Steps:
>
> [![Demo CountPages alpha](https://github.com/LukaszKolodziejski/managing-servers-2/blob/master/videoGIF/14-fast-summary.gif)](https://github.com/LukaszKolodziejski/managing-servers-1)