STRV TEST PROJECT

---

Demo

http://strv.jcunhafonte.xyz/

Bitbucket repository

https://bitbucket.org/jcunhafonte/strv-test-project

Introduction

Hi STRV,

I'm sending the test project you proposed to develop after our interview.

During the development of the project, I've tried to implement the challenge using the drawings you send me as guides. There are some details, such as transitions, the fixed menu background, among other details that I've decided to implement, in order to raise the project quality.

Considering the assets sent and the intended final design, some of the features had been a real challenge to develop, however I was capable of reaching the goal without changing any of the assets. For instance, the provided image present in the inferior and superior sections has a correspondent superior and inferior triangle which needed to be much larger than the provided one, in order to adapt to different screen resolutions. Having this problem in consideration, I've decided to solve it by creating an inverted triangle shape above the image. By doing this, I keep the image from losing its identity and I also ensure its responsivity. This approach may present some compatibility issues, however it makes the image work well in every screen resolution and this was the best solution I could find for this specific problem.

Briefly, to develop this project I used the following technologies:

• REACT
• REDUX
• SASS
• BABEL
• WEBPACK
• ESLINT
• REDUX DEVTOOLS

Although I've been working with the FLUX architecture for some time and have explored Redux by doing some exercises, I've never developed a final product with this technology. In the last few months I've been worked with ALT and REFLUX, however I've decided to develop this project with REDUX, since it's one of the technologies you are looking for at the moment. Also I could challenge myself by learning more about this interesting technology. I had some doubts related with the creation of the project structure, however I've tried to develop it as a way to evolve in the REDUX structure.

The structure I've implemented was the one I've considered the most correct for this project. There are certainly other alternatives to make it but, like I've already said, working with REDUX has been a challenge and I think there is no problem with this structure.

As you can check in my package I haven't used any other dependency except REACT or REDUX, in order to ensure the best perfomance of the project. The use of SASS and other compilation tools of WEBPACK was also used to serve the same purpose, that is ensuring the best performance of the project.

Installation

To test the development files, it's necessary to follow these steps:

Copy the files

$ git clone https://jcunhafonte@bitbucket.org/jcunhafonte/strv-test-project.git

Install the dependencies

$ npm install

Run the development server

$ npm start

Create the production build

$ npm run clean && npm run build:webpack

---

If you have any questions about the way I've structure the project or why I've made some decisions instead of others, feel free to contact me anytime to my personal phone number (+351) 910 414 293 or my email address zeecf@hotmail.com.

I hope I've reached your expectation and that you enjoy the final result as much as I do.

Best regards and wishes of good work,

José Fonte.