NOTE: This is React version of the Stroyka template. Also available:
- HTML/SASS version here
- Angular version here
- Vue.js version here
- MODX version here
If you do not know (or are unsure) which version you need, feel free to ask using the contact form on this page.
Stroyka — Tools Store React eCommerce Template, made specifically for a instruments/tools store, but also well suited for a auto parts store, electronics store, etc.
Purchased package includes:
- React files
- Next.js files
- SCSS files
- Documentation
Comparison between React and Next.js
Both versions of the template have the same appearance, but they also have the following differences:
React
- Based on: create-react-app
- Language: JavaScript (will be gradually translated into TypeScript)
- Supports SSR: No
- Documentation: Available
- Demo: Available
Next.js
- Based on: create-next-app
- Language: TypeScript
- Supports SSR: Yes
- Documentation: Available
- Demo: Not available
Features
- 100% Responsive Layout
- LTR/RTL supported
- HTML5 and CSS3
- Bootstrap 4
- SASS
- CSS3 Animation
- SVG Icons
- Font Awesome Icons
- BEM syntax
- Roboto Google Font
- Compatible with all major browsers
- Grid / List products view
- Quickview
- PhotoSwipe gallery on the product page
- Off canvas filters
- Search suggestions
- Server Side Rendering (SSR)
Fonts
Icons
Most of the icons used in the template are in SVG format,
for the rest the following fonts are used:
- Font Awesome (https://fontawesome.com/) – for social networks icons.
Third-party packages used in the template
- Next.js (https://nextjs.org/)
- Next Redux Wrapper (https://github.com/kirill-konshin/next-redux-wrapper)
- React Helmet Async (https://github.com/staylor/react-helmet-async)
- React Input Range (https://github.com/davidchin/react-input-range)
- React Intl (https://github.com/formatjs/react-intl)
- React Redux (https://react-redux.js.org/)
- React Router Dom (https://reacttraining.com/react-router/web)
- React Router Scroll 4 (https://github.com/ytase/react-router-scroll)
- React Slick (https://react-slick.neostack.com/)
- React Toastify (https://fkhadra.github.io/react-toastify/)
- Reactstrap (https://reactstrap.github.io/)
The following libraries and frameworks are also used:
- Bootstrap (https://getbootstrap.com/)
- Classnames (https://github.com/JedWatson/classnames)
- Redux (https://redux.js.org/)
- Redux Thunk (https://github.com/reduxjs/redux-thunk)
- PhotoSwipe (https://photoswipe.com/)
NOTE: Images in the demo are not included in the purchased package.
Changelog
Version 1.9.0 — September 1, 2021
- Next.js:
- Added: Discount prices in search suggestions;
- Updated: Next.js from 10.0.8 to 11.1.2;
- Updated: Sass from 1.32.8 to 1.38.2;
- Updated: Other dependencies.
- React:
- Added: Discount prices in search suggestions;
- Changed: node-sass package replaced with sass;
- Updated: React from 17.0.1 to 17.0.2;
- Updated: Other dependencies.
Version 1.8.0 — March 13, 2021
- Next.js:
- Fixed: Search suggestions don’t close when clicked;
- Fixed: The search button in the header not working on mobile;
- Fixed: Prop `className` did not match in StroykaSlick component;
- Fixed: Warning message when swiping carousel;
-
Fixed: Resetting the state of pagination, sorting and limit when returning to the previous page in the browser
history; - Updated: Next.js from 10.0.2 to 10.0.8;
- Updated: Bootstrap from 4.5.3 to 4.6.0;
- Updated: Other dependencies.
- React:
- Updated: react-scripts from 4.0.0 to 4.0.3;
- Updated: Bootstrap from 4.5.3 to 4.6.0;
- Updated: Other dependencies.
Version 1.7.0 — November 19, 2020
- Next.js:
-
Fixed: Incorrect definition of the current slide in react-slick when changing the number of slides
after initialization; -
Fixed: Bug of displaying slides of a react-slick if the infinite property is true and the slides are
not enough to fill the entire frame; - Updated: Next.js from 9.4.4 to 10.0.2;
- Updated: React from 16.13.1 to 17.0.1;
- Updated: Other dependencies.
- React:
- Updated: react-scripts from 3.4.1 to 4.0.0;
- Updated: React from 16.13.1 to 17.0.1;
- Updated: Other dependencies.
See the complete changelog
in the documentation for the React version and
in the documentation for the Next.js.
